この内容は古いバージョンです。最新バージョンを表示するには、戻るボタンを押してください。
バージョン:12
ページ更新者:atom
更新日時:2026-08-07 17:13:40

タイトル: Bladeテンプレート(ビュー/レイアウト)
SEOタイトル: LaravelのBladeテンプレート(ビュー/レイアウト)とは

この記事の要点
  • Laravel の Blade テンプレートエンジン
  • 拡張子: .blade.php
  • 主要機能: テンプレート継承 (@extends / @section / @yield) + ディレクティブ (@if / @foreach / @csrf)
  • コンパイル結果は storage/framework/views/ にキャッシュされる

 

LaravelにはBladeというテンプレートエンジンがある。

 

Bladeテンプレートとは？

Bladeテンプレートを使うとと、共通部分（ヘッダー、サイドバー、フッター等）は親ビューに記述し、各ページのコンテンツは親ビューを継承した小ビューに記述するというようなことができる。

また、ディレクティブ（@～）を使用することで「if」や「for」を簡潔に記述することが出来る。

テンプレートの拡張子は「.blade.php」とする。

 

ビューとは

ビューはアプリケーションのフロントエンドを担当する。

Laravelでは、表示用のテンプレートをあらかじめ用意し、それを利用して画面表示を行うことが可能。(Bladeテンプレート)

テンプレートは、「resources」フォルダ内にある「views」フォルダの中に配置する。また、PHPファイルとして作成する。

レイアウトという大枠を作ってそこにビューを組み込むのが一般的なやり方。

 

レイアウトの定義

以下の様に、レイアウトは大枠を定義する。

<!-- resources/views/layouts/app.blade.php -->
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Laravel Quickstart - Basic</title>

        <!-- CSSとJavaScript -->
    </head>

    <body>
       


           
       

        @yield('content')
    </body>
</html>

「@yield('content')」にビューを組み込んで内容を表示させる。

@yield('content')

ビューの定義

以下の様に画面に入力項目やボタンを追加する。


@extends('layouts.app')

@section('content')

   

   


       
        <form action="{{ url('task') }}" method="POST" class="form-horizontal">
            {{ csrf_field() }}

           
           


               

               


                    <input type="text" name="name" id="task-name" class="form-control">
               

           

           
           


               

                    <button type="submit" class="btn btn-default">
                        タスク追加
                    </button>
               

           

        </form>
   

@endsection

「@extends('layouts.app')」は先ほどの「resources/views/layouts/app.blade.php」レイアウトを使用するという意味。

「@section('content')」から「@endsection」の内容を、先ほどのレイアウトで定義した「@yield('content')」の部分に挿入する。

 

ビューの表示

ルーティング機能を利用し、テンプレートの表示が可能。

Route::メソッド ( ※値 , function () ) {

    return view(テンプレート , [連想配列]);

});


第1引数：使用するテンプレートの名前を指定。

第2引数：テンプレートに渡す値を連想配列で指定。指定された連想配列の値は、そのままテンプレート内で使うことが可能。

※ルーティングで割り当てるアドレス

 

具体例は以下の通り。

Route::get('/', function () {
    return view('tasks');
});