Laravelで簡単な掲示板を作成
魁!小野の塾 PHPで簡単なプログラムを作ってみようの巻 第1話 では、簡単な掲示板をPHPで作成しました。
今回は、同じような機能をLaravelで構築していきます。
機能的には、登録処理、削除処理、エラーチェックなどを実装していきます。
前回のソースは、200行程度の1ファイルだったのですが、今回はどのように書き方が変わるのか、見ていければ良いかと思います。
また、フレームワークを利用する機会は増えましたので、しっかり開発手順を覚えて頂きたいです。
Bootstrapを利用したサンプルを作成していますが、Laravelは Tailwind をCSSのフレームワークとして押しています。
Tailwindはコンポーネント開発を前提としたCSSフレームワークで、CSSを知っている人には使いやすいですが、Bootstrapを長年利用している人には、少し難易度が高いと思います。
対象のスキルレベル
- 魁!小野の塾 開発環境構築の巻 XAMPPインストール を読み環境構築済である
- Composerインストール(Windows) 開発環境構築の巻 魁!小野の塾 を読み環境構築済である
- Laravelの環境構築 開発環境構築の巻 魁!小野の塾 を読み環境構築済である
- 魁!小野の塾 PHPで簡単なプログラムを作ってみようの巻 第1話 を読み一通り理解できる
- 追いつけない方は、魁!小野の塾 目次 から入門編を一通り見て下さい。
構築環境
- Windows10
- XAMPP 8.1.2(PHP 8.1.2, MariaDB 10.4.22)
- Laravel v9.33.0
リスト表示処理実装
リスト表示は、初期表示の/bbs のURLで実行されます。
Controllerでは、index 関数でリストを取得します。
app/Http/Controllers/BbsController.php
index 関数に、掲示板のリストを取得する部分を追加します。
10 11 12 13 14 15 16 17 18 19 20 | ・・省略・・ /** * Display a listing of the resource. * * @return \Illuminate\Http\Response */ public function index() { return view( 'bbs' , [ 'bbses' => Bbs::all()]); } ・・省略・・ |
return で返却する部分の、view 関数の指定で、第2引数に、連想配列を入れていきます。
Bladeでは、キーに指定している文字列が変数として利用可能です。
Bbs はモデルですが、Eloquentに all 関数が用意されており、全件を取得します。
ページング処理 (Laravel公式)
全件表示ではなく、1ページ20行、前ページや次ページなどのページング処理を行うには、結構手間がかかります。
Laravelでは、ページング処理(ペジネーション)が簡単に出来る仕掛けを用意しています。
resources/views/bbs.blade.php
Blade側では、Controllerで指定したキーである、$bbses を利用して、ループ処理で全件出力します。
73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 | ・・省略・・ </form> <hr> @ foreach ( $bbses as $b ) <div class = "card" > <div class = "card-header" > <div class = "row" > <div class = "col-sm-6" > <strong>{{ $b ->title }}</strong> </div> <div class = "col-sm-6 text-right" > <small>{{ $b ->update_at }}</small> </div> </div> </div> <div class = "card-body" > <div class = "float-end" > <button type= "submit" class = "btn btn-outline-danger btn-sm" > <i class = "far fa-trash-alt" ></i> 削除 </button> </div> <div class = "card-text" > <p class = "white-space" style= "white-space: break-spaces;" >{{ $b ->contents }}</p> </div> </div> </div> <div class = "mt-3" ></div> @ endforeach <div class = "mt-5" ></div> </main> ・・省略・・ |
@foreach にて、Contollerで指定したキー bbses を利用してループしています。
今回は、リストがない場合に何も表示しないようにしています。
リストの中身は、一行ごとに $b 変数に代入されますので、あとはアロー演算子(->) の後に項目名を指定します。
表示する際は、XSS対応を意識して、{{ $var }} の形で表示させます。
内容部部は改行を含みますので、<pre>を利用するか、styleに white-space: break-spaces; を指定しましょう。
※Bootstrapには、break-spaces を指定するものが無いようです。
削除処理実装
削除処理を実行していきます。–resource オプションを指定時は、URL /bbs/{id}、HTTP METHOD DELETE で送信された場合に、
Controllerの destroy 関数が実行されます。
app/Http/Controllers/BbsController.php
destroy 関数の実装を行います。
77 78 79 80 81 82 83 84 85 86 87 88 89 | ・・省略・・ /** * Remove the specified resource from storage. * * @param \App\Models\Bbs $bbs * @return \Illuminate\Http\Response */ public function destroy( $id ) { Bbs::destroy( $id ); return redirect( '/bbs' ); } } |
destroy 関数の引数ですが、Controllerを作成する際に自動生成される、destroy 関数の引数は、$bbs となっています。
URL の引数に id が入っている為、Bbsのモデルが取れると思いきや、とれませんでした。残念。
ですので、$id に変更しています。これは URL の引数になるので、値が入ります。
Eloquentに、主キー指定でモデルを削除する destroy 関数が用意されています。
引数の $id を指定していモデルの削除を実行します。
indexへリダイレクトすると、リストの再取得が行われて、削除完了になります。
削除後のメッセージ表示 (Laravel公式)
登録後や削除後はページをリダイレクトします。リダイレクトする場合は、パラメータが消えてしまいます。
その場合に、メッセージを表示した場合は、セッションを利用するのですが、Laravelには、セッションに一時的にメッセージを保存する仕掛けが用意されています。
resources/views/bbs.blade.php
Blade側では、HTTP METHOD DELETE で送信します。あまり聞き覚えのないメソッドだと思います。
書き方がありますので、しっかりと覚えて下さい。
87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 | ・・省略・・ <div class = "card-body" > <div class = "float-end" > <form method= "post" action= "{{ route('bbs.destroy', $b->id) }}" > @csrf @method( 'DELETE' ) <button type= "submit" class = "btn btn-outline-danger btn-sm" > <i class = "far fa-trash-alt" ></i> 削除 </button> </form> </div> <div class = "card-text" > <p class = "white-space" style= "white-space: break-spaces;" >{{ $b ->contents }}</p> </div> </div> ・・省略・・ |
formタグのmethod属性には、post を指定しています。
action属性には、{{ route(‘bbs.destroy’, $b->id) }} を指定していますが、route 関数では、routes/web.php で指定した、Route::resource(‘bbs’, BbsController::class); のキー部分(bbs)に関数名を指定すると、URLが生成されます。
その際、destoryのURLには、{id} が必用になるため、引数に $b->id を指定しています。
@csrf は、登録時と同様にクロスサイト・リクエスト・フォージェリ対応です。
@method(‘DELETE’) をつけることで、HTTP METHOD を DELETE に指定して送信することができます。ちなみに、PUT や PATCH も同様に行います。
ちなみに、HTMLではのformタグでは、HTTP METHODの指定は、POST及びGETのみをサポートしています。なので、PUT、PATCH、DELETEなどは送信することが出来ません。
これで一通りの実装が終了しましたので、ブラウザにて確認してください。
http://localhost/bbs/public/bbs
画面がでて、未入力時にエラーが出たり、入力時に登録できたり、削除出来れば完成です。
動かない場合は、もう一度最初から読み直してください。
次回は、Laravelでの簡単な開発のまとめをお届けします。