Laravelのインストールと環境構築【Laravel入門講座】

Laravel入門

Laravelを使うための環境構築について解説します。

最初はインストールするものも多いので、すごくスムーズに進められたとして、2~3時間は見ておいたほうが良いでしょう。

はまると、もっとかかります^^;

本記事ではLaravelを使うために必要なもの、初期設定をひとつずつ説明していきますね。なお、Windows環境での解説となります。

★Youtube動画もあるので、文字だけでは分かりにくければ、動画を見ながら進めてみてください。

Laravel入門講座:環境設定【前半】Laravelのインストールを実演
★「初心者のためのLaravelの教科書」無料プレゼント中:★ブログ記事:当チャンネルは、phpフレームワークのLaravelを初心者向け...

★MACご利用の場合は、こちらの記事をご覧ください♪

初心者のためのLaravel入門:基本の環境構築

ざっと次のものが必要になります。

  • XAMPP(MacならMamp)
  • コマンドプロンプト(Macならターミナル)
  • コンポーザー
  • Laravel
  • Node.js

ひとつずつ解説していきますね。

XAMPP(MacならMamp)のインストール

XAMPP(ザンプ)またはMamp(マンプ)は、PHPを使っている人ならインストール済みかと思います。

もしまだ入れていなければ、インストールしておいてください。

XAMPPのインストール・設定方法は別の記事で説明しているので、参考にしてくださいね。

なお2022年2月8日にLaravel9がリリースされました。Laravel9ではPHP8以上が必要になります。

XAMPPを切り替えて、PHP7とPHP8をひとつのPCで使う方法は下記にて解説しています。

コマンドプロンプト(Macならターミナル)を確認

これはデフォルトでついています。

スタートメニューのWindowsシステムツール/コマンドプロンプトを選択してください。

なおキーボードのWindowsマーク+【R】キーを押すと、左下に「ファイル名を指定して実行」と出てきます。

ここから【cmd】と入力しても起動します。

2回目以降は入力する手間が省けるので、手早く起動できます。

コンポーザーのインストール

次にコンポーザーをインストールします。

コンポーザーとはPHPのパッケージ管理システム。

インストール先はこちら

じゅんこ
じゅんこ

印象的な画像ですよね。ちなみに、なぜ指揮者かといえば、英語でコンポーザー(composer)は作曲家、構成者の意味があるから。

ここで【Download】ボタンを押すと、次の画面になります。

【Composer-Setup.exe】をクリックしてファイルをダウンロードしてください。

ダウンロード後、exeファイルをダブルクリックしてインストールを進めていきます。

Laravel(ララベル)のインストール

ようやくLaravelのインストールです。

プロジェクトの新規作成、といったほうが正しいかもしれません。

ここまでの設定は最初だけ行えばOKですが、Laravelのプロジェクト作成は、新たにWebアプリを作成するたびに実施します。

最初にコマンドプロンプトを立ち上げてください。

Laravelをインストールしたいフォルダに移動します。

コマンドプロンプトを使ってディレクトリを移動する方法

ディレクトリを移動するには、次のようにコマンドを入力します。

  • 今【laravel】フォルダにいて、ひとつ上の階層の【htdocs】フォルダに移動する場合

  • 今【laravel】フォルダにいて、ひとつ下の階層の【blog】フォルダの中に移動する場合

うまくできなかったら、下記の cdコマンドの使い方についての記事を読んでください。

Laravelをインストールする

次のように入力します。

最後の「bbs」はプロジェクト名になるので、好きなように変更してください。

インストール後、しばらく待ちます。

インストールが完了すると、【set successfully】といった文字が出てきます。

インストールしたフォルダを開きましょう。

Visual Studio Codeなどのツールを使っている場合は、ファイル/フォルダーを開く から、フォルダを選択してください。

*プロジェクト作成時に

”Allowed memory size of 1610612736 bytes exhausted” 

といったエラーが出た場合は、下記の記事に解決法を掲載しています。

*2022年2月8日に、Laravel9がリリースされました。Laravel9では、PHP8以上が必要となります。

もし環境を変更するのが難しい場合には、ひとつ古いバージョンであるLaravel8を入れる手もあります。下記記事を参考にしてください。

ただ、検証したところ、PHP8未満の環境でバージョン指定なくLaravelをインストールすると、自動でひとつ前のバージョンであるLaravel8が入りました。(2022年3月)

Laravelプロジェクトをブラウザに表示

Laravelのプロジェクトを表示させるには、いくつか方法があります。

php artisan serve とコマンドを入力すれば、Laravelサーバーが立ち上がります。

ブラウザのURLに【http://127.0.0.1:8000/】と入力すれば、Laravelの初期画面が表示されます。

XAMPPを使っている場合には、XAMPPを立ち上げた状態で【http://localhost/ laravel/bbs/public】と入力します。

データベースと接続

次にLaravelをデータベースと接続させておきましょう。

①データベースの作成

XAMPPのMySQL【Admin】を押し、MySQLを起動します。

新規作成ボタンを押します。

新しくデータベースを作成しておきます。

名前はなんでもよいのですが、ここでは「TEST」としておきますね。

②環境設定ファイルの編集

Laravelをインストールしたフォルダのなかの 【.env】ファイルを開きます。

12行目あたりの【DB_DATABASE】という項目に、作成したデータベースの名前をいれておきます。

※データベースのユーザー名を変えたりパスワードを変更した場合には、【DB_USERNAME】や【DB_PASSWORD】も設定しておきましょう。

③マイグレート実行

最後に、次のようにコマンドを打ちます。

これでデータベースとの接続完了です。

じゅんこ
じゅんこ

データベースの中には、次のようなテーブルが作成されているはず。phpMyAdminにログインして確認してみてくださいね。

Node.jsのインストール

Laravelで開発を進める時には、Node.jsも必要になることが多いです。

公式サイトからインストールしておきましょう。

Windowsなら【Windows Installer】、Macなら【macOS Installer】を選びます。


ダブルクリックしてインストールを進めていきます。

インストールが終わった後は、コマンドプロンプトで次のように入力します。

下記のようにバージョン情報が表示されれば、無事インストールされています。

 

じゅんこ
じゅんこ

私は途中でWindows PowerShellが表示されたり、よくわからない状況に。

とりあえず放置しているうちにインストールが終わりましたが、5分程度と、わりと長くかかりました。

 

初心者のためのLaravel入門:認証設定もしておこう

以上で基本の環境構築はおわり。

と言いたいところですが、もう少し頑張って、環境を設定していきましょう。

JavascriptやCSSを使うための設定を行っていきます。

認証機能なども入れておきましょう。

Laravelには、認証機能を搭載する方法がいくつかあります。気になったら、こちらの記事を読んでくださいね。

本記事では、Laravel Breezeを入れる方法と、Laravel/uiを入れる方法のふたつをご紹介します。

Laravel Breezeでは、cssはTailwindを使います。Laravel/ui では、Bootstrapが使えます。どちらかお好きなほうを選んでくださいね。

 

Junko
Junko

Bootstrapについて知識がおありでしたら、Laravel/uiをいれて、Bootstrapを使うのがおすすめ。

そうではないならBreezeをいれて、Tailwind CSSを使うほうが良いかと思います。

ひとことメモ

認証機能は、Laravel7ではbootstrapなどが推奨されていましたが、Laravel8ではjetstreamが推奨となりました。

ですがjetstreamは使いにくいとの声もあり、あとからBreezeが登場しました。

選択肢① Breezeで認証機能を作る

まずは、Breezeを使う方法を解説します。

コマンドプロンプトを立ち上げ、Laravelがインストールしてあるフォルダに移動します。

次のように入力します。

次の画面になります。

続いて、下記を実行します。

しばらく後に、”npm install && npm run dev” を実行するように促す画面になります。

npmのインストールコマンドを実行します。

*2022年6月29日以降、BreezeまたはJetstreamパッケージでLaravelの最新版を入れると、下記画面が表示されます。

このままだと、新たなコマンドは打てません。

コマンドプロンプトはこのままの状態にし、新たにコマンドプロンプトを立ち上げ、cdコマンドを使ってプロジェクトをインストールした場所に移動してください。

なお、”vite dev server runnning” 画面になる理由や、viteの機能にご興味あれば、下記をご覧ください。

エラーの時の対応

なお、”severity vulnerabilities”が理由で、npm installがエラーになることもあります。

その場合は、エラーを読んで、指示に従ってコマンドをいれてください。

たとえば下記では、”npm audit fix” を実行するように出ています。

こういった場合は、npm audit fixを実行した後、再度 npm installを実行してください。

ブラウザで確認

下記のコマンドを実行します。Laravelのサーバーが立ち上がります。

ブラウザのURL欄に【http://127.0.0.1:8000/】を入力してください。

次のようなページが表示されていれば、インストール無事成功。

右上にLoginとRegisterというボタンができているので、どちらかをクリックしてみてください。

Tailwindで作られたフォームが表示されます。

なお、もしロゴが大きく表示されてしまったり、レイアウトが崩れている場合には、再読み込みを実施しましょう。

Google Chromeの場合はF12を押した後、下記の再読み込みボタンをクリックし、【キャッシュの消去とハード再読み込み】を実行します。

選択肢② Laravel ui で認証機能を作る

次に、Breezeではなく、Laravel uiを使う方法を解説します。

コマンドプロンプトを立ち上げ、Laravelがインストールしてあるフォルダに移動します。

次のように入力します。

【generated successfully】とでれば、インストール完了です。

次に、今組み込んだ ui 機能を使って、認証機能のひな形ファイルを作成してもらいます。

下記のように入力します。

最後の【–auth】とありますが、こうしておけば認証(ログイン/ユーザー登録)機能もついてきます。

なおbootstrap以外にも、vue、react もインストール可能です。

vue の場合は、下記を実行します。

Reactの場合は、下記を実行します。

このあと、npm installと npm run dev コマンドを実行します。

これによって、必要なパッケージ管理機能が使えるようになります。

エラーの時の対応

なお、”severity vulnerabilities”が理由で、npm installがエラーになることもあります。

その場合は、エラーを読んで、指示に従ってコマンドをいれてください。

たとえば下記では、”npm audit fix” を実行するように出ています。

こういった場合は、npm audit fixを実行した後、再度 npm installを実行してください。

ブラウザで確認

下記のコマンドで、Laravelのサーバーが立ち上がります。

ブラウザのURL欄に【http://127.0.0.1:8000/】を入力してください。

次のようなページが表示されていれば、インストール無事成功。

右上にLoginとRegisterというボタンができているので、どちらかをクリックしてみてください。

Bootstrapを入れた場合、Bootstrapで作られたフォームが表示されます。

Laravelの初期設定を変更する

最後に、下記の3つだけ初期設定も行っておきましょう。

  • タイムゾーン
  • 言語
  • 警告メッセージを日本語にする
  • ルート設定 <- 以前のルート設定を使う時だけ必要

タイムゾーンと言語の変更

Laravelをインストールしたフォルダの中の config/app.php ファイルを開きましょう。

70行目ぐらいに ‘timezone’ があるので、【Asia/Tokyo】と変更します。

83行目ぐらいに’locale’ があるので、【ja】と変更します。

画面でみると、次のようになります。

じゅんこ
じゅんこ

上記はVisual Studio Codeというエディタを使っています。

他の物でもよいのですが、何かエディタをインストールしておくと便利ですよ。

日本語にする

次にLaravelのユーザーインターフェースや警告メッセージ等を日本語にしていきます。

日本語翻訳には、こちらのLaravel-Lang langというライブラリが便利です。

このライブラリをダウンロードします。Codeから【Download ZIP】を選んでください。

ローカル上で、ダウンロードしたファイルを解凍します。

ファイルの中には、localesとsourceの2つのディレクトリが入っています。

localesディレクトリの中には、色々な言語の翻訳が入っています。日本語の翻訳は、jaディレクトリの中に入っています。ja内のファイルをコピーします。

コピーしたファイルは、プロジェクトをインストールした場所に貼り付けます。

プロジェクトディレクトリ/lang(Laravel8の場合は、プロジェクトディレクトリ/resources/lang) のなかに、ja.json ファイルを貼り付けます。ja.jsonには、基本のユーザーインターフェースの翻訳が含まれています。

 

残りのファイルは、 プロジェクトディレクトリ/lang(プロジェクトディレクトリ/resources/lang)のなかに jaディレクトリを作り、その中に貼り付けます。残りのファイルは、バリデーションやページネーションといった部分の翻訳が含まれています。

これで日本語化は完了です。試しにログイン画面でエラーを表示させると、次のように日本語で表示されます。

Laravel日本語化はこちらの記事もお役立てください。

翻訳が気に入らない時や、翻訳されていない箇所があるときの対応も掲載しています。

ルート設定のための設定をする(しなくてもOK)

Laravel7ではコントローラーフォルダへのパスが通っていたのですが、Laravel8では自分で設定する必要があります。

毎回パスを書くのは、結構メンドウ。

最初に app/ProvidersのRouteServiceProvider.php の29行目を変更しておけば、毎回パスを入れる必要はありません。

Laravel8では、デフォルトではRouteServiceProvider.php の29行目が無効になっています。お好みに応じて、有効にしておきましょう。

【デフォルト】

【変更後】

Laravel9では、上記のコードが最初から入っていません。そのため、Laravel側では、現在パスを省く方法は推奨していないように思います。

なので、この設定は行わず、毎回コントローラーのパスを入れるほうをおすすめします。

もし「パスをいれるのが面倒だから、Laravel9でもこの設定が必要」という場合には、下記記事を参考に、Laravel9のRouteServiceProvider.phpファイルを編集してくださいね。

補足:2つ目のプロジェクトを作るとき

なお2個目以降のプロジェクトを作る場合は、下記のインストールは不要です。

  • XAMPP(MacならMamp)インストール
  • コンポーザーインストール
  • Node.jsインストール

まずLaravelのプロジェクト作成のコマンドを入力した後、データベースを作成+初期設定を行っていきましょう。

さいごに

Laravelインストール、おつかれさまでした!

いろいろと入れなきゃいけないので、大変ですよね^^;

なお、記事はLaravelのバージョンアップの度に追記したり、バージョンごとの情報を併記しているので、読みにくい部分もあったかもしれません。

もし「最新のLaravel9版の方法だけ知りたい」という場合には、学習サイト「Laravelの教科書」をおすすめします。

Laravelの基本の使い方を学びつつ、フォーラムサイトを作っていける学習内容です。

学習サイトでは、Laravel8・Bootstrap版 と Laravel9・Breeze版(Tailwind CSS利用)、ふたつのテキストをご用意しています。

それぞれ別々に書かれているので、読みやすいかなと思います。

 

Junko
Junko

現在、インストール等を解説した基礎編部分、無料でご覧いただけます♪ ご興味あれば、こちらのご案内ページご覧ください。

Laravelの教科書について詳しく知る

Laravel入門

【Laravelの教科書・無料プレゼント】

Junko
Laravelの使い方を覚えたい!と思ったら、ぜひ、役立ててほしいです。
ひつじプログラマ
会員制サイトをいちから作っていくよ。ボタンをクリックして詳細を見てね。
Laravelの教科書の詳細を見る

Laravel8版と、最新のLaravel9版、ふたつのテキストご用意してます♪

【無料プレゼント】

「LaravelでWebアプリをいちから作れるようになりたい!」

そんなLaravel初心者のあなたへ【Laravelの教科書】基礎編プレゼント中! 会員制フォーラムサイトを学習しながら作れます。

詳細はこちらをクリック

Laravel8版と、最新のLaravel9版、ふたつのテキストご用意してます♪

Laravel関連のご相談承ってます♪
「Webアプリを開発してほしい」
「社内にLaravelが分かる人がいない。コンサルしてほしい」
そんな企業様のご依頼承っています。
お問い合わせはこちら
Laravel関連のご相談承ってます♪
「Webアプリを開発してほしい」
「社内にLaravelが分かる人がいない。コンサルしてほしい」
そんな企業様のご依頼承っています。
お問い合わせはこちら
Twitter始めました。
40代からプログラミング!

コメント

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