0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

BladeTemplate(Laravel11)

Posted at

概要

今日はLaravelのBladeTemplateについて知ってみます。
開発方法論にはMVCパターンというものがあります。
簡単に説明すると以下のような内容になります。

(M)odel:DB接続と関連する部分
(V)iew:画面に見せる部分
(C)ontroller:プログラミング部分

本記事では(V)iew部分にて各変数内容を画面に表示して確認します。
※(M)odleと(C)ontrollerは本記事では利用しないです。

事前準備

Laravel11の環境がすでに準備されている方はこの事前準備はスキップしても大丈夫です。
Raspberry環境でLaravel11環境を構築については下記の記事を参照してみてください。
■Raspberry PIにLaravel11をインストール

■Hello World出力(Laravel11)

Viewで設定した変数内容を画面に表示

①次の画面通りにソースコードを作成します。
PATH:[/]-[routes]-[web.php]ファイルに追加します。

Route::get('/list', function(){
    return view('list',[
        'boradName'=>'掲示板',
        'lists'=> [
            [
                'no' => 1,
                'title' => 'No1タイトル',
                'body' => 'ここが本文です。'
            ],
            [
                'no' => 2,
                'title' => 'No2タイトル',
                'body' => 'ここが本文です。'
            ],
        ]
    ]);
});

②追加した画面です。
image.png

③次はweb.phpに定義した変数内容を画面表示するコードを追加します。
PATH:[/]-[resources]-[views]-[list.blade.php]ファイルに追加します。

<!DOCTYPE html>
<html lang="jp">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        <h1>{{ $boradName }}</h1>
        @foreach($lists as $row)
        <h2>{{$row['title']}}</h2>
        <p>{{$row['body']}}</p>
        @endforeach
    </body>
</html>

④追加した画面です。
image.png

⑤次のURLから結果を確認します。
確認URL:http://192.168.1.65:8000/list
⑥以下のように画面が表示されます。
image.png
⑦コードの説明です。
下記はroute-web.phpの説明です。

#/-routes-web.php
#'/list':URLに指定する「http://xxx.xxx.xxx/list」が該当する部分です。
#'view('list':「list.blade.phpに次のboardName、listsを出力するBlade Template名です。
#'lists'変数には配列タイプで複数のデータを定義しています。
Route::get('/list', function(){
    return view('list',[
        'boradName'=>'掲示板',
        'lists'=> [
            [
                'no' => 1,
                'title' => 'No1タイトル',
                'body' => 'ここが本文です。'
            ],
            [
                'no' => 2,
                'title' => 'No2タイトル',
                'body' => 'ここが本文です。'
            ],
        ]
    ]);
});

下記はlist.blade.phpの説明です。
※HTMLタグ部分は省略します。

#/-resources-view-list.blade.php
<h1>{{ $boradName }}</h1> # $boardName変数の値を表示するタグ部分です。
@foreach($lists as $row)   # listsの配列を表示するため、foreach文です。
<h2>{{$row['title']}}</h2> # 配列のタイトル部分を表示するタグです。
<p>{{$row['body']}}</p>   # 配列の本文部分を表示するタグです。
@endforeach               # listsの配列を表示するため、foreach文です。

laravelでは変数の値を表示するためには以下のように書きます。
■Laravel式

{{$変数名}}

既存のPHPで書く方法は、次のコードです。Laravel式と比べると少し長いですね。
■PHP式

<?php echo $変数名 ?>

phpのforeachループは下記のような書きます。
他の繰り返し構文は次の参照サイトを参考してみてください。

@foreach($lists as $row)
@endforeach

★参照サイト★

if文を利用して表示

①次のようにif文を追加して掲示板の表示されるリストの件数を表示します。

        <h1>
            {{ $boradName }}
            @if(count($lists)>0)
            {{count($lists)}}
            @endif
        </h1>

②追加した画面です。
image.png

③次のURLから画面を確認します。
確認URL:http://192.168.1.65:8000/list
image.png

終わりに

MVCパターンの中でViewだけで画面にデータを表示するサンプルを作ってみました。
変数の値表示、配列の値を表示、IF文を利用して表示などを学ぶことができました。今日はここまでです。ありがとうございます。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?