投稿の編集ページを表示する。投稿にコメントを追加する。Laravelアプリケーションを作成するまず最初に、下記のコマンドを実行してアプリケーションを作成しましょう。次に、アプリケーションの初期設定を行います。ENVファイルの設定.envファイルを編集して初期設定を行います。今回はメールなどは利用しませんので、データベースの設定を自分のローカル用に設定しましょう。以下はmampを利用した場合の設定例です。DB_CONNECTION=mysqlDB_HOST=localhostDB_DATABASE=laravel_bbsDB_USERNAME=rootDB_PASSWORD=rootDB_SOCKET=/Applications/MAMP/tmp/mysql/mysql.sock日本語環境の設定タイムゾーンを日本、言語を日本に設定します。config/app.phpファイルを編集して下記の項目について変更します。'ja',データベースの作成データベースのテーブルを作成するためのマイグレーションファイルを作成します。データベース(ここでは、「laravel_bbs」という名前)は事前に作成しておく必要があります。雛形にユーザー用のマイグレーションが含まれていますが、今回は利用しませんので下記のファイルは削除しておきます。commentsテーブルを作成します。下記のコマンドを実行しましょう。○○_create_comments_table.phpが作成されました。マイグレーションの実行順序をつけるため、ファイル名にマイグレーションファイルの作成日時がついています。○○_create_posts_table.phpを下記のように編集します。}}続いて、○○_create_comments_table.phpを下記のように編集します。}}これでマイグレーションファイルの作成は完了しました。下記のコマンドによりマイグレーションを実行します。2018_12_02_190934_create_comments_table上記のように返答が返ってくればテーブルが作成されています。モデルの作成テーブルを作成しましたので、それに対応するモデルを作成します。下記のコマンドを実行してモデルを作成します。app/Comment.phpファイルが作成されました。app/Post.phpを以下のように設定します。}}app/Comment.phpはこちらのように設定します。}}fillableはモデルを利用してデータを作成する時に、複数代入を許可するための設定です。テーブル間のリレーションの設定となります。投稿は複数のコメントを持ち、コメントは一つの投稿に従属します。Laravelのコマンドについては、こちらの記事でまとめていますので、併せてご覧ください。開発を進めやすくするため、テストデータを投入しておきます。下記のコマンドを実行して、ファクトリを作成します。--model=Commentdatabase/migrations/PostFactory.phpとdatabase/migrations/CommentFactory.phpが作成されました。それぞれのファイルを下記のように設定します。テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト。\nテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト。テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト。テキストテキストテキストテキストテキストテキスト。\nテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト。];});実行用のシーダークラスを作成します。PostsTableSeederdatabase/seeds/PostsTableSeeder.phpファイルが作成されました。下記のように編集します。}}50件の投稿を作成して、各投稿に2つのコメントを作成します。最後に、database/seeds/DatabaseSeeder.phpを開いて、runメソッドにPostsTableSeederを追加します。$this->call(PostsTableSeeder::class);}それでは、下記のコマンドを実行して、テストデータをデータベースに投入しましょう。successfully.と表示されれば完了です。投稿の一覧これより画面を作成していきます。Laravelのローカルサーバーを起動しておきます。こちらのコマンドは開発中は実行したままにしておきます。serveまず、投稿の一覧画面を作成しましょう。最初に、routes/web.phpを開き、ルーティングを設定します。welcomeの記述は使わないので、削除しましょう。'PostsController@index')->name('top');次にコントローラーを作成します。下記のコマンドを実行しましょう。PostsControllerapp/Http/Controllers/PostsController.phpが作成されました。下記のように、indexメソッドを追加します。}}投稿を作成日時の降順で取得して、posts.indexにデータを渡してビューを生成します。続いてビューを作成します。その前にレイアウトの共通テンプレートとして、layout.blade.phpを下記のように作成します。bootstrapが利用できるようにCSSを読み込んでいます。</div></body></html>では、一覧用のビューとして、resources/views/posts/index.blade.phpファイルを作成して、下記のようにします。</div>@endsectionhttp://localhost:8000/アクセスして、下記のように表示されればOKです。投稿の一覧を取得して、リスト表示しています。200)))は、str_limitメソッドにより投稿の最初の200文字を取得して、改行ありで表示しています。Bladeテンプレートの使い方は、こちらにまとめていますので併せて参照ください。次に投稿を作成できるようにします。投稿の作成画面の表示・作成処理のためのルーティングを追加します。'store']]);PostsControllerに処理を追加します。投稿を追加した後は、トップページにリダイレクトするようにします。redirect()->route('top');}続いて、ビューを作成します。resources/views/posts/create.blade.phpを作成して、以下のように編集します。</div>@endsection一覧画面から、投稿作成画面へのリンクもつけましょう。resources/views/posts/index.blade.phpを開いて、投稿のリストの上に下記を追加します。</a></div>これで、投稿を新しく追加できるようになりました。次に、投稿にコメントを追加する機能を実装します。コメントは、投稿に複数登録することができ、長くなる場合もありますので、投稿の詳細画面を追加して、そこでコメントを追加できるようにしましょう。投稿の詳細画面を実装していきます。投稿の表示のためのルーティングを追加します。routes/web.phpを開いて、以下のようにshowメソッドにルーティングが通るようにを修正します。'show']]);続いて、コントローラーに処理を追加します。PostsController.phpを開いて、showメソッドを追加します。]);}次に、ビューを追加します。resources/views/posts/show.blade.phpを作成して、以下のように編集します。<p>コメントはまだありません。</div>@endsection最後に、一覧画面に、投稿の詳細画面へのリンクをつけます。resources/views/posts/index.blade.phpを開いて、下記のように投稿本文の下にaタグをつけましょう。続きを読む</a>トップページにアクセスして、投稿の一覧と投稿の詳細画面が表示できればOKです。投稿にコメントを追加する機能を実装します。ルーティングを追記します。['store']]);次にコントローラーを作成します。CommentsControllerCommentsControllerを以下のように編集します。}}投稿の詳細画面に、コメント追加のリクエストを送るためのフォームを追加しましょう。resources/views/posts/show.blade.phpを開いて、コメントリストの上にフォームを追記します。</div></form>これで、投稿の詳細画面からコメントを追加できるようになりました。次に投稿を編集できるようにしてみます。updateを追加します。'update']]);PostsContollerにedit,updateメソッドを追加します。$post]);}編集画面のビューを作成します。resources/views/posts/edit.blade.phpを作成して、以下のように編集します。</div>@endsection最後に、投稿の詳細画面から編集画面へのリンクを追加します。resources/views/posts/show.blade.phpを開いて、投稿のタイトルの上あたりに、下記のリンクを追加します。</a></div>以上で、投稿を編集できるようになりました。次に投稿を削除する機能を実装します。ルーティングにdestroyメソッドを利用できるように追記します。'destroy']]);PostsControllerにdestroyメソッドを実装します。redirect()->route('top');}投稿の詳細画面に、削除ボタンを設置します。編集ボタンの右に並ぶ様に、下記のコードをを追記します。btn-danger">削除する</button></form>以上で、削除機能は完了です。削除の処理には、投稿と紐づくコメントを削除する必要があり、トランザクションを使いました。トランザクションの使い方については、下記の記事で詳しく説明しています。現状の投稿一覧ですと、投稿が増えていくと処理がどんどん重くなっていきますので、ページネーションをつけてみましょう。PostsControllerのindexメソッド内にて、投稿リストを取得する処理を以下のように変更します。'desc')->paginate(10);resources/views/posts/index.blade.phpを開いて、投稿リストの下部に追記します。}}</div>これでページネーションが表示されるようになりました。ページネーションの詳細については、こちらの記事で詳しく説明しています。Laravelでページネーションを実装する方法クエリのチューニング最後に、クエリをチューニングしてみます。Laravelで実行されているクエリがわかるように、app/Providers/AppServiceProvider.phpを開いて、boot関数を以下のように変更します。});}この状態でトップページにアクセスします。ログファイルをみると以下のように、クエリを12回実行していることがわかります。ログファイルは、storage/logsディレクトリ以下に作成されます。一覧画面には投稿のリストに加えて、紐づくコメントの合計数を表示しているため、取得した投稿の数だけコメント数をカウントするクエリが発行されてしまっています。これを解決するために、投稿のリストを取得した時に、紐づくコメントを読み込むようにチューニングしてみます。PostsControllerのindexメソッドで投稿のリストを取得している処理を、以下のように変更します。'desc')->paginate(10);再度トップページにアクセスして、ログファイルを見てみます。53)クエリの実行回数がが3回だけになったことがわかります。問題と言い、Laravelではwithメソッドを利用することで解決することができます。withメソッドの使い方については、こちらに詳しくまとめています。with(Eagerロード)の使い方・サンプル付きさいごに長くなりましたが以上で、掲示板を作成するチュートリアルは終了です。あなたは、記事の通り進め完成させることができましたか?次の学習ステップとしては、Laravelの本で体系的に機能を把握し、追加機能を実装してみると良いと思います。人気Laravelの学習におすすめの本を2選!追加機能の開発では、次のようなことなどをやってみると良いと思います。コメントの編集/削除ユーザー登録チュートリアルが難しかった方は、スクールでエンジニアのメンタリングを受けながら学習するというのも良い方法です。5日About東京のITベンチャー企業で開発の責任者をしています。未経験からスタートアップのエンジニアになり、4社・6年目。フロントからインフラまで何でもやります。hiroyuki90。