【最新】Laravel8でサーバーを起動し、ログイン機能を実装しよう！

#目標
* Laravelのインストール
* MySQLのインストール
* ログイン機能の実装

Laravel v8.40(最新:2021年5月4日時点)のartisanコマンドでサーバーを立ち上げ、
データベースを作成しログイン機能を実装します。

#前提条件
* composer (v2.0.13)
* PHP (v8.0.3)
* Homebrew  (v3.1.5)

自身の環境では、以上のツールとバージョンをインストールしています。

まだ、インストールされていない方・バージョンが古い方は、
事前にインストール・アップデートを済ませていただきますようお願いします。




#Laravelのインストール

それでは早速、実装していきましょう！

まずは、以下ディレクトリ内でcomposerコマンドを使用し、laravelをインストールします。


```:/Users/user
Users-PC:~ user$ composer create-project laravel/laravel laravel
```




インストールしたlaravelディレクトリに移動し、
artisanコマンドを使用することでversion確認をすることができます。


```:/Users/user/laravel
Users-PC:laravel user$ php artisan -v 
Laravel Framework 8.40.0
```



laravelディレクトリ直下でサーバーを起動します。

```:/Users/user/laravel
Users-PC:laravel user$ php artisan serve
```
以上で、laravelがインストールされたのページにアクセスすることができます。
http://localhost:8000/

#MySQLのインストール

続いて、MySQLをインストールします。


好きな場所でHomebrewを活用し、mysqlをインストールします。

```
Users-PC:laravel user$ brew install mysql
```

以下コマンドでmysqlファイルのインストール先を確認することができます。

```
Users-PC:laravel user$ which mysql
/usr/local/bin/mysql
```

今回```/Users/user/laravel/.env```ファイルの中では、
データベース名は「laravel」で初期設定されているため、
MySQLに「laravel」という名前のデータベースを追加します。

```:.env
 DB_DATABASE=laravel
```


因みに、```ls -a```というlinuxコマンドを使用することで
.envファイルの存在を確認することができます。

```:/Users/user/laravel
Users-PC:laravel user$ ls -a
.                  .env               .gitignore         app                composer.json      database           package.json       resources          storage            vendor
..                 .env.example       .styleci.yml       artisan            composer.lock      node_modules       phpunit.xml        routes             tailwind.config.js webpack.config.js
.editorconfig      .gitattributes     README.md          bootstrap          config             package-lock.json  public             server.php         tests              webpack.mix.js
```

laravelディレクトリ直下でmysqlコマンドを使用し、mysqlにアクセスします。

```:/Users/user/laravel/
Users-PC:laravel user$ mysql -uroot
```

SQL文でlaravelというデータベースを作成します。

```:mysql
mysql> create database laravel;
Query OK, 1 row affected (0.00 sec)
```

SQL文でlaravelというデータベース名があることを確認できます。

```:mysql
mysql> show databases;
+--------------------+
| Database           |
+--------------------+
| information_schema |
| laravel            |
| mysql              |
| performance_schema |
| sys                |
+--------------------+
5 rows in set (0.00 sec)
```
以上でmysqlの設定は終わりです。
しかし、このままページにアクセスした際に.envに記述されているDB_HOST名に誤りがあるため、
以下のようなエラーメッセージが出てしまいます。(正式にいうと誤りではありませんが、接続方法が異なります。）

```SQLSTATE[HY000] [2002] Connection refused ```

![スクリーンショット 0003-05-04 2.58.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263502/c19f17ed-a9a8-6446-55cd-bd696de33ee5.png)

.envファイルのDB_HOST名を```127.0.0.1 → localhost```に変更します。

* localhost・・・ソケットファイルを使用した接続
* 127.0.0.1・・・TCP/IPを使用した接続


```:.env 
変更前
 DB_HOST=127.0.0.1

変更後
 DB_HOST=localhost
```
.envファイルやconfig/*.phpファイルを編集した際には、
必要に応じてartisanコマンドを活用し変更した設定を反映させましょう。
(過去に数時間悩んだエラーが、これらによって解決したこともあるため、覚えて損はないかと思われます。)

```php artisan config:cache```
```php aritsan config:clear```
```php artisan cache:clear```
```php artisan route:clear```
```php artisan view:clear```

```:/Users/user/laravel
 Users-PC:laravel user$　php artisan config:cache
```

#jetstreamのインストール&ログイン機能実装
最後に、jetstreamのパッケージをインストールしてログイン機能を実装していきましょう。

それではまず、composerのjetstreamのパッケージをインストールします。

```:/Users/user/laravel
 Users-PC:laravel user$　composer require laravel/jetstream
```

artisanコマンドでjetstreamをインストールしましょう。
jetstreamでは、「livewire」と「inertia」のパックを選択してインストールすることができます。

* livewire これまでのlaravelのbladeを活用するパック
* inertia Vue.jsやReactといったjavascriptを活用するパック

今回当方では、inertiaをインストールしていきます。

```:/Users/user/laravel
 Users-PC:laravel user$　php artisan jetstream:install inertia
```

jetstreamのインストールが完了したら、npmをインストールしてビルドしていきましょう。

```:/Users/user/laravel
 Users-PC:laravel user$　npm install && npm run dev 
```

最後にartisanコマンドを実行し、データベースにテーブルを挿入していきましょう！

```:/Users/user/laravel
 Users-PC:laravel user$　php artisan migrate
Migrating: 2014_10_12_000000_create_users_table
Migrated:  2014_10_12_000000_create_users_table (14.84ms)
Migrating: 2014_10_12_100000_create_password_resets_table
Migrated:  2014_10_12_100000_create_password_resets_table (8.38ms)
Migrating: 2014_10_12_200000_add_two_factor_columns_to_users_table
Migrated:  2014_10_12_200000_add_two_factor_columns_to_users_table (8.48ms)
Migrating: 2019_08_19_000000_create_failed_jobs_table
Migrated:  2019_08_19_000000_create_failed_jobs_table (9.86ms)
Migrating: 2019_12_14_000001_create_personal_access_tokens_table
Migrated:  2019_12_14_000001_create_personal_access_tokens_table (14.20ms)
Migrating: 2021_05_03_160333_create_sessions_table
Migrated:  2021_05_03_160333_create_sessions_table (19.12ms)
```

上記のように```php artisan migrate```が実行できれば、恐らくログイン機能が実装できていることでしょう！

http://localhost:8000/

右上に```Login / Register```が表示されていれば成功です！

![スクリーンショット 0003-05-04 3.32.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1263502/88067740-0956-68c1-744f-b3a07ca2fecc.png)


ご拝読ありがとうございました！

もし、参考になった方がいらっしゃいましたら```LGTMボタンのクリック```をお願いします！