ログイン機能の実装（Laravel Breeze）

nakatievent commented 3 years ago

JetStreamとBreezeについて

どうやらLaravel8でログイン機能を実装するにはJetStreamかBreezeパッケージのどちらかを使用する必要がありそうだ。

今回はシンプルなログイン、新規登録機能を実装したかったので、Breezeを選択することにした。

JetStreamについて↓

ログイン
ユーザー登録
メール認証（本登録メール）
２段階認証
セッション管理
チーム管理　（👈 使う or 使わないを選べます）

Breezeについて↓

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

nakatievent commented 3 years ago

composerのインストール

Laravel Breezeパッケージのインストールをしようと composer require laravel/breeze --devを実行したところ、 zsh: command not found: composerと出た。

要はcomposerがインストールされていないという意味らしいので、【Laravel入門】MacでLaravelを使う準備。まずはComporserのインストールを参考にcomposerをインストールしていく。

curl -sS https://getcomposer.org/installer | phpでインストールして、 sudo mv composer.phar /usr/local/bin/composerでComposerをどこからでも呼び出すことができるようにした。

ちなみに、composerとはPHPのパッケージの管理ツールのことらしい。 RubyでいうBundleのようなものか。

準備が完了したところで、composer -vを実行すると、

   ______
  / ____/___  ____ ___  ____  ____  ________  _____
 / /   / __ \/ __ `__ \/ __ \/ __ \/ ___/ _ \/ ___/
/ /___/ /_/ / / / / / / /_/ / /_/ (__  )  __/ /
\____/\____/_/ /_/ /_/ .___/\____/____/\___/_/
                    /_/
Composer version 2.0.9 2021-01-27 16:09:27

のようにcomposerのバージョンが出たので、インストールは完了したと思われる。

nakatievent commented 3 years ago

Laravel Breezeのインストール

composer require laravel/breeze --devでBreezeをインストールして下記のメッセージが出た。

18 package suggestions were added by new dependencies, use `composer suggest` to see details.
Generating autoload files
8 packages you are using are looking for funding.
Use the `composer fund` command to find out more!

そして、php artisan breeze:installすると下記のエラーが。。。

Could not open input file: artisan

どうやら、コマンドを叩いているディレクトリが違っていたらしく、cd backendでディレクトリを移動した。

すると、そのアプリディレクトリにはcomposerがすでに存在していた。

自分はさっき別のディレクトリにインストールしていたようなので、それをスッと削除した。。。

nakatievent commented 3 years ago

Laravel Breezeの再インストール

Laravelの公式リファレンス気を取り直して。上記のリファレンスに従い再度やってみることに。

composer require laravel/breeze --devすると下記のメッセージが出て成功。

Package manifest generated successfully.
74 packages you are using are looking for funding.
Use the `composer fund` command to find out more!

php artisan breeze:installも成功。

Breeze scaffolding installed successfully.
Please execute the "npm install && npm run dev" command to build your assets.

npm installもインストール成功。

added 1348 packages, and audited 1348 packages in 1m

90 packages are looking for funding
  run `npm fund` for details

npm run devも成功。

   Laravel Mix v6.0.11

✔ Compiled Successfully in 8335ms
┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┬──────────┐
│                                                                                                                                                                                          File │ Size     │
├───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼──────────┤
│                                                                                                                                                                                    /js/app.js │ 672 KiB  │
│                                                                                                                                                                                   css/app.css │ 3.75 MiB │
└───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┴──────────┘
webpack compiled successfully

nakatievent commented 3 years ago

実装成功

ブラウザでアプリケーションを見ると、アプリの右上にログイン、新規登録の文字が出ていた。

ただ、ログイン機能を自動で実装したことで、色々とファイルとかも増えてきたからそこを理解するのに骨が折れそう。。。

nakatievent commented 3 years ago

Laravel Breezeのアンインストール

Laravel BreezeはTailwindCSSを使用しているので、Bootstrapベースで使えるLaravel uiに切り替えることにした。

切り替えの手順はこちらに記載する。

nakatievent / my_baby_diary_app