[ はじめて の Laravel ] リンク一覧ページ を 作る No.1
この記事は 2021年 11月 22日 に書かれた記事です。
今回は リンク一覧を 表示させるための インデックスページ ( 白紙ページ ) を作成していこうと思います
何から順にやるのが 良いのかわからないのですが まずは ビューを作って コントローラを作って ルーティング の設定 の順に 進めます
テンプレートの作成
laravel は Bladeテンプレート というものがあって .blade.php という ファイル拡張子で resources/views ディレクトリ に 置きます
今回は リンク一覧ページを作るので resources / views / links / template.blade.php という 名前で テンプレートを作ります
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<title>@yield('title')</title>
<style>
@yield('style')
</style>
<script>
@yield('script')
</script>
</head>
<body>
<main class="container">
@yield('content')
</main>
<!-- Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
</body>
</html>
インデックスページの作成
次に このテンプレートを使って インデックスページ ( resources / views / links / index.blade.php ) を作ります
@extends('links.default')
@section('title', 'links.index')
@section('content')
<section class="my-3 links">
<header>
<h2 class="text-center">@yield('title')</h2>
</header>
</section>
@endsection
テンプレートの選択
ここで出てくる @extends('links.default') が 使用する テンプレートの指定になります
今回は resources / views 以下に links / template.blade.php を 置いたので 名前が 'links.default' になります
テンプレートのセクション
Bladeテンプレート には セクションという 機能が あって テンプレートの内容を 書き換える事ができます
今回の場合 テンプレート側の @yield(‘title’) が @section(‘title’, ‘links.index’) によって 書き換えられ links.index と 表示されます
同名のセクションがあった場合 一番最初に読み出された セクションのみが 反映されます
コントローラの作成
コントローラは コマンドから 雛形を作ります
example-app に 移動してから
php artisan make:controller LinkController --resource
を 叩きます
すると app / Http / Controllers / LinkController.php に ファイルが生成されるので public function index() の 中身を書き換えます
public function index()
{
return view('links.index');
}
今回は resources / views 以下の links / index.blade.php を 表示させるので 'links.index' になります
ルーティングの設定
ルーティング は routes / web.php で 設定します
今回は app / Http / Controllers / LinkController.phpindex を 表示させるので
Route::resource('/links', App\Http\Controllers\LinkController::class)->only(['index']);
と なります
ページの確認
ルーティング で '/links' で ページを表示させるようにしたので
http://localhost:50000/links/ で 確認できます
links.index とだけ 表示されていれば ページの作成はできています
