概要
Laravel Breeze を利用してユーザ認証機能を確認してみる。
参考Webページ
- スターターキット 10.x Laravel
https://readouble.com/laravel/10.x/ja/starter-kits.html - マイグレーション 10.x Laravel
https://readouble.com/laravel/10.x/ja/migrations.html
Laravel Breeze について
ログイン、ユーザ登録、パスワードリセット、メール確認、パスワード確認などの認証機能と、
ユーザ自身が名前・メールアドレス・パスワードを更新できる
シンプルなプロファイルページを含む機能を、小さくシンプルにLaravelへ実装したもの。
Tailwind CSSでスタイルしたシンプルなBladeテンプレートで構成されているらしい。
インストール
パッケージを追加する
$ cd プロジェクトフォルダ
$ ./vendor/bin/sail composer require laravel/breeze --dev
上記コマンドを実行後、次の結果が表示される。
Info from https://repo.packagist.org: #StandWithUkraine
./composer.json has been updated
Running composer update laravel/breeze
Loading composer repositories with package information
Updating dependencies
Lock file operations: 1 install, 0 updates, 0 removals
- Locking laravel/breeze (v1.21.0)
Writing lock file
Installing dependencies from lock file (including require-dev)
Package operations: 1 install, 0 updates, 0 removals
- Downloading laravel/breeze (v1.21.0)
- Installing laravel/breeze (v1.21.0): Extracting archive
Generating optimized autoload files
> Illuminate\Foundation\ComposerScripts::postAutoloadDump
> @php artisan package:discover --ansi
INFO Discovering packages.
laravel/breeze .............................................................................................................................. DONE
laravel/sail ................................................................................................................................ DONE
laravel/sanctum ............................................................................................................................. DONE
laravel/tinker .............................................................................................................................. DONE
nesbot/carbon ............................................................................................................................... DONE
nunomaduro/collision ........................................................................................................................ DONE
nunomaduro/termwind ......................................................................................................................... DONE
spatie/laravel-ignition ..................................................................................................................... DONE
81 packages you are using are looking for funding.
Use the `composer fund` command to find out more!
> @php artisan vendor:publish --tag=laravel-assets --ansi --force
INFO No publishable resources for tag [laravel-assets].
No security vulnerability advisories found
Using version ^1.21 for laravel/breeze
インストール
$ ./vendor/bin/sail artisan breeze:install
上記コマンド実行後、いくつかENTERキーなどを押して、次の結果が表示されて完了する。
Which stack would you like to install?
blade ............................. 0
react ............................. 1
vue ............................... 2
api ................................ 3
❯ 0 ※ 0を入力してENTER。
Would you like to install dark mode support? (yes/no) [no]
❯ ※ 何も入力せずENTER(noを選択したことになる)
Would you prefer Pest tests instead of PHPUnit? (yes/no) [no]
❯ ※ 何も入力せずENTER(noを選択したことになる)
INFO Installing and building Node dependencies.
added 112 packages, and audited 113 packages in 17s
20 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
> build
> vite build
vite v4.3.7 building for production...
✓ 49 modules transformed.
public/build/manifest.json 0.26 kB │ gzip: 0.13 kB
public/build/assets/app-74be5a14.css 30.46 kB │ gzip: 5.88 kB
public/build/assets/app-e7c8c463.js 69.13 kB │ gzip: 25.73 kB
✓ built in 1.17s
INFO Breeze scaffolding installed successfully.
migrateコマンドでDBにテーブルを作成
次のコマンドを実行すると、
プロジェクト内のマイグレーションファイルの内容をDBに反映させることができる。
$ ./vendor/bin/sail artisan migrate
上記コマンドを実行すると、次の結果が表示される。
INFO Preparing database.
Creating migration table ........................ 20ms DONE
INFO Running migrations.
2014_10_12_000000_create_users_table ........................ 38ms DONE
2014_10_12_100000_create_password_reset_tokens_table ........................ 43ms DONE
2019_08_19_000000_create_failed_jobs_table ........................ 30ms DONE
2019_12_14_000001_create_personal_access_tokens_table ........................ 43ms DONE
完了後に5つのテーブルが作成されるので、phpmyadminから確認すると良い。
機能の確認
http://localhost/へWebブラウザでアクセスすると、
右上にログインとレジスターと書かれたリンクが2つできる。
レジスターをクリックし、適当な情報を入力して登録すると、
その作成したアカウントのダッシュボードが表示される。
プロファイルページを表示することもでき、
ユーザ名やメールアドレス等の変更、アカウントの削除などの操作ができる。
アカウントを作成した後、phpmyadminのusersテーブルにて、
DBにも反映されていることを確認できる。
補足
インストール時に選択するstackについて
- blade
Laravelに含まれるテンプレートエンジン。 - react
Meta社とコミュニティによって開発されているUI開発のための、JavaScriptライブラリ。
シングルページアプリケーションやモバイルアプリケーションの
開発におけるベースとして使用できるらしい。 - vue
Webアプリケーション(シングルページアプリケーションも可)の
UI開発のためのOSSのJavaScriptフレームワーク。 - api
Next.jsなどを利用する時に使うらしい。
Next.jsはNode.js上に構築されたOSSのReactのフレームワークらしい。
サーバサイドスクリプトや静的Webサイトの生成などの、
ReactベースのWebアプリケーション機能を有効にするらしい。