今回発生した問題点をおさらい
Laravel6.0以前では以下のコマンド一つで簡単にログイン処理を実装する事が出来ましたよね?
php artisan make:auth
しかしながらこの機能が先日リリースされたLaravel6.0から廃止されてしまったようです…。Laravelを使っている人なら簡単なアプリケーションを作る際に一度は使った事があるコマンドだと思います。
今回はLaravel6.0で今まで同様にログイン処理を実装する方法についてご説明します。
事前準備
ログイン処理を実装するために必要な環境を事前に構築する必要があるので、必要な環境の一覧を以下に示します。
- Laravel6.0以降のバージョンがインストールされている事
- PHP7.2.*がインストールされている事
- Node.jsがインストール済みである事
恐らくこのページを見ている皆さんは上の二つはすでに完了しているので三つ目のNode.jsがインストールされているかの確認をしてください。
インストールされてない人は以下のサイトを参考にNode.jsのインストールをまず行なってください。
以上で事前準備は完了です。
Laravel6.0でのログイン機能の作成方法
1. laravel/uiのインストール
Laravel6.0以前のバージョンでは標準でVue.jsやCSSのBootstrapが組み込まれていましたが、Laravel6.0以降では外部ライブラリになり標準では組み込まれなく変更されました。
その為、laravel/uiと言うパッケージをインストールする必要があります。以下のコマンドでComposerでインストール可能です。
composer require laravel/ui
2. ユーザー登録画面や認証画面の作成
今まで、「php artisan make:auth」とやってきた処理とほとんど同じ内容をここで行います。Laravel6.0以降ではuiコマンドにオプションを指定する方法に変更されました。
また、使用するUIのタイプは bootstrap, vue, react の3種類から選べます。ここではVue.jsを使用して行う方法をご説明します。
php artisan ui vue --auth
3. マイグレーション
この処理は今までと全く変わりませんね!ユーザー管理に関係するテーブル作成のためにマイグレーションを行いましょう。
php artisan migrate
4. フロントエンドに必要なパッケージのインストール
Laravelプロジェクトのルートディレクトリで以下のコマンドを実行してください。package.jsonに記載されたパッケージが一括でインストールされます。
*ここでNode.jsが必要になるのでインストールしていない人は事前準備に戻ってインストールしておきましょう。
npm install
cssやJavaScriptをビルド
以下のコマンドを実行してcssやJavaScriptを作成してビルドを行います。処理自体はpackage.jsonに書かれているコマンドが実行されています。
npm run dev
実行されるコマンド(ここに書かれているものはターミナル上で実行する必要はありません)
"scripts": { "dev": "npm run development", "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", }
以上でLaravel6.0以前のログイン処理の実装と全く同じものが実装できたと思います。以下のような画面が表示されたらOKですね!
参考資料
Laravel公式のログイン処理に関する資料があったので参考までに載せておきます!