phpのlayout機能
rubyでいう部分テンプレートと一緒
bladeと呼ばれるviewファイルを呼び起こすファイルがlaravelにはあります
これはRailsでいうerbファイルですかね。
早速下記にlayout.blade.phpファイルを用意します。
<!DOCTYPE html> <html lang="{{ str_replace('_', '-', app()->getLocale()) }}"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>@yield('title')</title> <!-- Fonts --> <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet"> <!-- Styles --> <style> 中略 </style> </head> <body class="antialiased"> <div class="relative p-4"> <nav> <a href="/">Home</a> <a href="/about">About</a> <a href="/contact">Contact</a> // 各コンテンツのリンク </nav> </div> <div class="relative flex items-top justify-center min-h-screen bg-gray-100 dark:bg-gray-900 sm:items-center py-4 sm:pt-0"> @yield('content') //ここに呼び出したいビュー </div> @yield('scripts'); // JavaScriptを呼び出す </body> </html>
@yield('content')は呼び出したいビューです。
逆に各リンクのコンテンツ以外は全て共通部分なので、上記のコードで一纏めにしてます。
それではContactのbladeファイルはどうなっているか見てみます
@extends('layout') // layoutに反映させる記述
@section('title', 'Contact Us') // <head>内の<title>も反映
@section('content') // 以下が読み込みたいコンテンツ
<div class="max-w-6xl mx-auto sm:px-6 lg:px-8">
<div class="flex justify-center pt-8 sm:justify-start sm:pt-0">
<h1>Contact Us</h1>
</div>
<div class="mt-8 bg-white dark:bg-gray-800 overflow-hidden">
<p>This is the contact page.</p>
</div>
</div>
@endsection
@section('scripts') // 反映させたいJavaScript
<script>
alert('contact us');
</script>
@endsection
まだまだ細かい記述などはこれからですが、
とりあえずこれだけ覚えてたら大丈夫そうです。
共通部分のbladeファイルを作り、各コンテンツに反映させる。
まだRubyでもオリジナルアプリを作ってませんが、
とりあえずPHPでそろそろ作る時期が近いづいてるかもしれません。
