LaravelにJetstreamをインストールする方法

未分類

こんにちは、ななです。

今回、LaravelにJetstreamをインストールしたので、その方法についてご紹介します。

この記事は、すでにLaravelをインストールしており、
これからログイン機能を実装したい方向けの記事です。

LaravelにJetstreamをインストールする方法

Jetstreamのインストール

Laravelのプロジェクトフォルダのルートディレクトリに移動します。

composerを使って、Jetstreamをインストールします。

$ composer require laravel/jetstream

Jetstreamのパッケージ(今回はlivewire)のインストール

次に、Jetstreamのパッケージをインストールします。

Jetstreamのパッケージは、livewireとinertiaの２種類がありますが、
今回はlivewireを導入します。

$ php artisan jetstream:install livewire

(inertiaを導入したい場合は、livewireをinertiaに変えれば良い)

livewireとinertiaの違いは、後ほど記事にまとめたいと思います。

npmのインストール

次に、npmとの依存関係をインストール・構築します。

$ npm install
$ npm run dev

DB(今回はSQLiteを使う)への接続

この手順は、まだDBに接続してない方向けです。
すでにDB接続が完了している方は、飛ばしていただいて大丈夫です。

まず、SQLiteのファイルを生成します。

$ touch database/database.sqlite

.envファイルの内容を、以下のように修正

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=

↓

# DB_CONNECTION=mysql
# DB_HOST=127.0.0.1
# DB_PORT=3306
# DB_DATABASE=laravel
# DB_USERNAME=root
# DB_PASSWORD=
DB_CONNECTION=sqlite
DB_FOREIGN_KEYS=true

データベース(SQLite)に接続できたか、確認します。

$ sqlite3 database/database.sqlite

結果：
sqlite>

結果「sqlite>」が表示されれば、OKです。

データベースを抜ける際は、以下の「.exit」コマンドを打てばOKです。

sqlite> .exit

用意したDBに、ログイン機能に必要なテーブル、カラムを準備

次に、Laravelが標準で用意している、ログイン機能に必要なテーブルやカラムを、
先ほど用意したDB(データベース)に反映させます。

$ php artisan migrate

ログイン機能が実装されていいるか確認

この時点で、http://127.0.0.1:8000/login にアクセスすると、
ログイン機能が実装されていることがわかります。

ユーザー新規登録機能、ユーザー情報の変更機能も実装されています。

しかし、デフォルトでは画像の通り、全て英語表記になっています。

次は、これらを日本語化していきましょう。

Jetstreamの日本語化

Laravelの日本語化

まず、Laravelが日本語に対応しているか確認します。

Laravelプロジェクトフォルダ内のconfig/app.phpファイルが、
以下のように書き換えてあるか確認してください。

'timezone' => 'UTC',
　　↓
'timezone' => 'Asia/Tokyo',

'locale' => 'en',
　↓
'locale' => 'ja',

Jetstreamの日本語化

GitHubのLaravel-Lang/langから、zipファイルをダウンロードします。

ダウンロードしたフォルダ内の以下の2つのファイル

  • lang-master/src フォルダ内にある ja フォルダ
  • lang-master/json フォルダ内にある ja.json ファイル

を、Laravelプロジェクトフォルダの resources/lang フォルダ内にコピーします。

これで、Jetstreamの日本語化は完了です。

以下のコマンドでローカルサーバーを起動し、
http://127.0.0.1:8000/login にアクセスしてみましょう。

$ php artisan serve

以下のように、日本語化されてるのが確認できます。

コメント

タイトルとURLをコピーしました