2023/03/18追記：この記事はLaravel10用の内容です。
Laravel11へのBreezeインストールについてはこちらの記事をご覧ください。
この記事のゴール
- Laravel10に Breeze をインストールして、ユーザー認証機能を使える状態にする。
- ユーザーを追加して実際にログインしてみる。
前提条件
- Laravel10 の開発環境構築が完了している。
※開発環境構築の必要がある場合はこちらの記事を参考にしてください。
Laravel Breeze とは
Laravel で構築するWEBサイトにユーザーログインなどの認証機能を設置する際には、
Laravel Breeze が便利です。
コマンド２個だけでインストール完了し、認証機能が使える状態になります。
ただし、公式ドキュメントにも書いてありますが、
Laravel Breeze は必要最小限の認証機能を持っていますが、
２段階認証などの高度な認証機能は持っていません。
高度な認証機能が必用な場合は、Laravel Jetstream などのパッケージが対応しています。
Laravel Breeze はインストール時に設定ファイル等を書き換えるので、
既存のプロジェクトへの導入には注意が必用です。
できればプロジェクトの初期段階で導入するかどうか決めましょう。
Laravel Breeze インストール
Ubuntu CLI等のターミナルで sail-shell へ接続します。
./vendor/bin/sail shell次のコマンドでインストールします。
composer require laravel/breeze
１分程度で完了します。
続いて、laravel で使えるように次のコマンドを実行します。
php artisan breeze:installスタックについて尋ねられるので、プロジェクトの性質に合わせて適宜選んでください。
今回は、「0」の blade を選択しておきます。
次に、「dark mode」を導入するか聞かれます。好きな方を選んでください。
今回はデフォルトの [no] にしておきます。
次に、自動テストのフレームワークを「PEST」にするか尋ねられます。
今回はデフォルトの「PHPUnit」を使うつもりなので、デフォルトの [no] にします。
１分程度で完了します。
ユーザー登録をしてログインしてみる
まずは、コンテナが起動している状態でブラウザのアドレスバーに「localhost」を入力してください。
ページ右上に「Log in」と「Register」が表示されていればインストール成功です。
ユーザー登録をするので「Register」のリンクをクリックしてください。
ユーザー登録画面が表示されるので、適当なユーザー名、パスワード、メールアドレスを入力して
（全部、忘れない程度の適当な入力で。ガチ入力すると情報漏洩の温床になります。）
（mailpitを導入してる場合は、送信されたメールは全てmailpitで逮捕してくれます。）
（ここでは、パスワードは「hogehoge」とかにしています。）
「REGISTER」ボタンをクリックしてください。
ユーザー登録が完了するとログインした状態になり、ダッシュボードに移動します。
一旦ログアウトしてからログインしなおしてみましょう。
ダッシュボード右上のユーザー名のプルダウンから「Log Out」を選択します。
トップページに戻るので、右上の「Log in」からログイン画面へ移動し、
先程登録した「Email」と「Password」を入力して「LOG IN」ボタンをクリックしましょう。
ログインに成功すると先程のダッシュボードに移動します。
パスワードを忘れた場合は、ログイン画面の「Forgot your password?」をクリックします。
確認ページで「Email」を入力して「EMAIL PASSWORD RESET LINK」をクリックします。
パスワードリセットの案内メールが送信されると、
同じ画面に送信完了の緑色のメッセージが表示されます。
mailpit を起動している場合は、ブラウザで「http://localhost:8025/」にアクセスすると
mailpit によって逮捕されたメールをチェックすることができます。
はい、「Reset Password Notification」というタイトルのメールが逮捕されていました。
メールのタイトルをクリックして内容を表示し、「Reset Password」ボタンをクリックしてください。
パスワードリセットの画面が開くので、新しいパスワードを入力して
「RESET PASSWORD」ボタンをクリックします。
パスワードリセットに成功すると、ログイン画面に移動して、
パスワードリセット完了の緑色のメッセージが表示されます。
先程登録したメールアドレスと、新しいパスワードを入力してログインしてみましょう。
これでログイン成功してダッシュボードに移動したら機能の確認は完了です。
お疲れさまでした。
コメント