こんにちは。フリーランス・コンサルタント＆エンジニアの九保すこひです。

X（Twitter）やってます！
九保すこひ＠フリーランスエンジニア｜累計300万PVのブログ運営中

さてさて、Laravel 8.xがリリースされ新ログインパッケージ「Laravel Jetstream」の高機能に驚かされたばかりですが、少し前にまた新しいログインのパッケージがリリースされたのをご存知でしょうか。

その名も・・・・・・

Laravel Breeze（ららべる・ぶりーず）

です。

もしかかすると、「もうJetstreamがあるのになんで❓」と思われた方もいるかもしれませんが、実はこのLaravel Breezeはコンセプトが、

『シンプルなスタート地点』

となっていて、Jetstreamとの違いは次のようになっています。

シンプルにログイン、会員登録、パスワード再発行だけ
livewire や inertia は使わず、Bladeを使う

そのため、ほぼLaravel 7.xまで使われていた laravel/ui と同じものと考えていいでしょう。（もしかすると、livewireやinertia.jsの学習コストを避けたいという要望があったのかもしれません）

そこで❗

今回は「よりシンプルなログイン機能」をLaravel Breezeで実装してみます。

ぜひ皆さんのお役に立てると嬉しいです😊✨

「冬は箱でカイロを買います❗ドッサリ」

開発環境： Laravel 8.x

1 パッケージをインストールする
2 必要になるJavaScript、CSSをビルドする
3 マイグレーションを実行する
4 テストデータをつくる
5 テストしてみる
6 ちなみに – その１：関連情報
7 ちなみに – その２：日本語化
8 ちなみに – その３：Jetstreamにあるその他の機能は？
9 おわりに

パッケージをインストールする

では、まずはLaravel Breezeをインストールします。
以下のコマンドを実行してください。

composer require laravel/breeze --dev

パッケージがインストールされたら、以下のArtisanコマンドを実行します。

php artisan breeze:install

実行すると以下のような表示になります。

必要になるJavaScript、CSSをビルドする

まだこの状態では、ログイン機能に必要なJavaScript、CSSファイルが有効になっていませんので、以下のコマンドを実行してビルドしてください。

npm install && npm run dev

※ ビルドが終わると、JavaScriptは以下のファイルにひとまとめにされています。

JavaScript　・・・　public/js/app.js
CSS　・・・　public/css/app.css

マイグレーションを実行する

では、最後にログインに必要なDBテーブルをつくります。
以下のコマンドを実行してください。

php artisan migrate

実行が完了すると、こうなります。

これでインストールは完成です。
この状態でトップページを再読込みしてみてください。

以下のように画面右上にログインとユーザー登録ページへのリンクが表示されていると思います。

テストデータをつくる

ログイン機能のインストールは完了していますが、実際にログインができるユーザーデータがありませんので、これをつくっていきましょう。

※ なお、JetstreamのインストールではLaravel 8.xから新しくなったFactoryを使いましたが、今回のテーマは「シンプルなログイン機能のインストール」なので、Seederを使った内容にしています。もしFactoryがお好みの方は以下のURLを参考にしてみてください。

📝 Laravel8.x以降でログイン機能をインストールする方法

以下のコマンドを実行してください。

php artisan make:seed UsersTableSeeder

すると、ファイルが作成されるので中身を以下のように変更してください。

database/seeders/UsersTableSeeder.php

<?php

namespace Database\Seeders;

use App\Models\User; // 👈 ここに注意です
use Illuminate\Database\Seeder;

class UsersTableSeeder extends Seeder
{
    public function run()
    {
        $names = [
            'taro' => '太郎',
            'jiro' => '次郎',
            'saburo' => '三郎',
            'shiro' => '四郎',
            'goro' => '五郎',
            'rokuro' => '六郎',
            'shichiro' => '七郎',
            'hachiro' => '八郎',
            'kuro' => '九郎'
        ];

        foreach ($names as $name_en => $name_jp) {

            User::create([
                'name' => $name_jp, // ユーザー名
                'email' => $name_en .'@example.com', // 👈 メールアドレス
                'password' => bcrypt('xxxxxxxx') // 👈 パスワード
            ]);

        }
    }
}

⚠ Laravel 8.xからは、初期状態のモデルのフォルダが変更になっていますので気をつけてください。

では、Seederファイルが実行されるようにLaravelに登録しましょう。

database/seeders/DatabaseSeeder.php

<?php

namespace Database\Seeders;

use Illuminate\Database\Seeder;

class DatabaseSeeder extends Seeder
{
    public function run()
    {
        // \App\Models\User::factory(10)->create();
        $this->call(UsersTableSeeder::class); // 👈 ここを追加しました
    }
}

これで準備は完了です。
以下のコマンドでDBを初期化＆テストデータの追加をしましょう。

php artisan migrate:fresh --seed

コマンドを実行すると、usersテーブルはこのようになります。

テストしてみる

では、実際にログインしてみましょう❗

「https://******/login」にアクセスすると、ログインフォームが表示されるので、先ほど登録したテストデータのメールアドレス＆パスワードを入力し、ボタンをクリックします。

すると・・・・・・

はい❗
ログインができました。

成功です😊✨

ちなみに – その１：関連情報

ログインに関連する独自設定のために関連情報をまとめました

ログイン後のリダイレクト先はどこで変更する？

以下の部分で変更できます。

app/Providers/RouteServiceProvider.php

public const HOME = '/dashboard';

※ なお、このリダイレクトURLは通常のログインだけでなく、ミドルウェアなどでいくつかの場所でも使われるURLです。

例：「app/Http/Middleware/RedirectIfAuthenticated.php」など

ログインのコントローラーはどこにある？

「app/Http/Controllers/Auth/AuthenticatedSessionController.php」になります。なお、各メソッドの意味は次のとおりです。

create()：ログインフォーム
store()：ログインの実行
destroy()：ログアウト

ログアウト後のリダイレクト先を変更するには？

以下の場所で変更できます。

app/Http/Controllers/Auth/AuthenticatedSessionController.php

public function destroy(Request $request)
{
    Auth::logout();

    $request->session()->invalidate();

    $request->session()->regenerateToken();

    return redirect('/'); // 👈 ここを変更してください
}