投稿者の環境
- MacBook Pro (13-inch, 2019, Two Thunderbolt 3 ports)
- macOS Big Sur バージョン11.0.1
- PHP 7.3.23
- Laravel Framework 6.20.7
はじめに
- laravelをインストール済みであることが前提となります。
- MVCの流れをアウトプットしやすいように
ルーティング
コントローラー
ビュー
の順に説明します。 - 今回は遷移すると文字が表示されるまでとなります。
ステップ1 welcome.blade.phpを編集しよう
laravelをインストール&ローカルサーバーを立ち上げたら大文字でlaravelという大きな文字が出てくると思います。
こちらのページからルーティングを設定しましょう。
welcome.blade.php
<div class="クラス名">
<a href="{{ url('/about_me/index') }}">about</a>
</div>
//{{ url('/表示させたいフォルダ名/ファイル名') }}
divクラスの入子に<a href="{{ url('') }}">
を作成します。
これを設定することによりルーティング化したページに飛べるようになります。
スクショとcssは分かりやすくするために調整しています。
ステップ2 web.phpでルーティングを設定しよう
web.php
Route::get('/about_me/index', 'AboutMeController@index')->name('about_me.index');
// '/about_me/index' 検索窓をクリックしたらURLに表示される部分
/* 'AboutMeController@index'
@ は、名前空間に属したクラスのメソッド指定の区切り。
名前空間@メソッド名 単刀直入に説明すると
コントローラー名@viewフォルダにあるファイル名
*/
// ->name('about_me.index');
nameを付けることによりルーティングに名前をつけて尚且つ分かりやすくするため。
補足
vscode上にて⌘+p
を実行すると指定のファイル名を検索できます!!
ファイル名を探すのが難しかったら是非覚えてください!!
ステップ3 コントローラーを作成しよう
//ターミナルにて
php artisan make:controller AboutMeController
//命名規則 php artisan make:controller 付けたい名前+controller
/* 補足
php artisan make:controller Testcontroller --resource
これを実行すると index create store等々の全てのコントローラーが作成される
*/
ステップ4 作成したコントローラーを編集しよう
AboutMeController.blade.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class AboutMeController extends Controller
{
public function index()
{
//表示させたいviewを指定させる
return view('about_me.index');
}
}
ステップ5 viewファイルを作成しよう
viewファルを作成するには手動にて作成します。
これからviewファイルを沢山作成する可能性がある場合はフォルダ毎に分けるのが一番分かりやすいです!!
フォルダ名/ファイル名
ステップ6 viewファイルに文字を入れよう
about_meフォルダ/index.blade.php
<!DOCTYPE HTML>
<html>
<head>
<title>About</title>
</head>
<body>
<h1>About Me</h1>
</body>
</html>
<h1>about_meフォルダのindexファイル</h1>
ステップ7 ページが遷移されるか確認しよう
ページが遷移されるかを確認するためローカルサーバーを立ち上げてください。
もし画面が遷移されない場合は下記を実行して下さい。
- 名前に間違いがないか?ちゃんと橋渡しができているかどうか。
- 分かりにくい場合は
php artisan route:list > route1.txt
を実行。ルーティングの一覧が出てきます。
ターミナルにて
php artisan route:list > route1.txt
以上となります。