前のパートに戻る 完了して次のパートへ  

  1-1 本章の流れ

本章では、Webサービスのトップページとなる記事一覧画面を作ります。

なお、本教材の完成形のWebサービスでは、各記事には

  • 記事更新・削除機能へのリンク
  • いいね機能
  • タグ表示
  • ユーザーページへのリンク

がありますが、それらは別の章で順次作っていきます。

本章の流れは、以下となります。

ルーティングの追加


まず、トップページのURL(/というURL)へアクセスがあった時に何か処理する、ということを定義します。

このようにURLと処理内容のひも付けを行うことをルーティングあるいはルート定義と呼びます。

コントローラーの新規作成


ルーティングによってURLと処理内容のひも付けが行われますが、その処理する内容をもう一段詳しく定義するのがコントローラーになります。

(なお、処理の内容によっては、さらに別の適したクラスへ処理を引き渡すといったことを行うのもコントローラーの仕事です)

Laravelでは、コントローラーをapp/Http/Controllersディレクトリに作成します。

本章ではコントローラーを新規に作り、さらに記事一覧のビュー(画面の見た目)を呼び出すindexアクションメソッドを定義します。

なお、本来は記事一覧の情報をデータベースから取得してビューに渡す必要がありますが、この段階ではダミーの固定データを渡すようにします。

ビューの新規作成


コントローラーによって呼び出される、記事一覧のビューを新規作成します。

また、今回のWebサービスの各画面で共通的に使用するナビバーも作成します。

これらビューには、Bladeと呼ばれるテンプレートエンジンを使います。

Bladeを使うことで、Laravelの変数などを使用したHTMLを生成して表示することができます。

記事テーブルとユーザーテーブルの作成


記事一覧は表示できましたが、そのデータはまだダミーです。

データベースから記事情報を取得して表示できるよう、まずデータベースに記事テーブルを作成します。

なお、記事テーブルを作成する際に、併せてユーザーテーブルも作成します。

記事モデルの作成


Laravelでは、テーブルのデータをモデルと呼ばれるクラスを通して取り扱うことが多いです。

そこで、記事テーブルをLaravelで取り扱うための記事モデルを作成します。

なお、ユーザーテーブルを取り扱うためのユーザーモデルは、Laravelインストール時に既に存在しているので作成は不要です。

コントローラーで記事モデルから記事情報を取得する


コントローラーのindexアクションメソッドを修正し、ダミーデータではなく、記事モデルの記事情報をビューに渡すようにします。

本章完了時点のソースコード


追加するコードは次のパート以降で順次掲載していきますが、本章完了時点のソースコードもGitHub上にまとめて公開しておきます。

必要に応じて参照ください。

各種一覧画面に関する補足


本教材では、教材のボリュームや優先度を勘案し、記事一覧画面などの一覧系の画面へのページネーション機能追加方法の解説は割愛しています。

本教材のWebサービスにページネーション機能を盛り込みたい方は、以下の解説などを参考にしてください。

議論

0 質問

このコースの評価は?