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

Laravel入門講座

Windows環境でXAMPP(ザンプ)を使ったLaravelのインストール・開発環境構築方法を解説します。

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

はまると、もっとかかります。

本記事ではLaravelを使うために必要なもののインストール方法や、初期設定をひとつずつ説明していきますね。

★Youtube動画もあります♪

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

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

★MACご利用の場合はこちら♪

本記事でもMacに触れていますが、下記記事で、より丁寧に解説しています。

★Laravel Sailについてはこちら♪

Laravel Sailは、Dockerを使った開発環境です。

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

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

  • XAMPP(MacならMamp)
  • コマンドプロンプト(Macならターミナル)
  • コンポーザー
  • Laravelプロジェクトの新規作成
  • Node.js

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

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

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

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

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

なおLaravel10ではPHP8.1以上、Laravel11ではPHP8.2以上が必要になります。

2024年3月13日現在、バージョンを指定せずインストールすると、Laravel11が入ります。

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をインストールする

ここでは、C:\xampp/htdocs/laravelの中にプロジェクトを作っていきます。

cdコマンドで laravel に移動し、次のように入力します。

最後の「members」はプロジェクト名になります。お好みで変更してください。

なお、Laravel10版をいれる場合は、下記のようにバージョンを指定しておきます。

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

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

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

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

*プロジェクト作成時に

” In GitDownloader.php line 82:

git was not found in your PATH, skipping source download”

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

*プロジェクト作成時に

”Allowed memory size of 1610612736 bytes exhausted” 

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

*Laravelは、バージョンによって、必要なPHPのバージョンが異なります。Laravel9では8.0以上、Laravel10では8.1以上が必要です。古いバージョンのプロジェクトを入れたい場合には、下記の記事を参考に、バージョンを指定してください。

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

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

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

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

【http://localhost/ laravel/members/public】としても、表示されます。

データベースと接続

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

なお、Laravel11からはデフォルトのデータベース管理システムがSQLiteになりました。ただ、Xamppを使った場合、データベース管理システムはMariaDBとなります。そのため、下記設定を行っておきましょう

①デフォルトのデータベース管理システムの変更

.envファイルの 「DB_CONNECTION=sqlite」を変更します。MariaDBを使っている場合には、「DB_CONNECTION=mariadb」とします。

また、DB_HOST以下がコメントアウトされているので、コメントアウトを外して有効にしておきます。データベース名もmembersに変えます。

【.env】

エラーが発生した場合は、下記記事も参考にしてください。

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

Laravel10(以前のバージョン)の場合の環境設定ファイルの編集

Laravel10の場合には、デフォルトのデータベース管理システムはmysqlなので、こちらの手順は不要です。Laravelをインストールしたフォルダのなかの 【.env】ファイルを開きます。

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

②データベースの作成

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

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

新しくデータベースを作成します。名前は「members」としておきます。

*MySQLエラー対策

MYSQLを起動しようとしても起動できず、上記のように赤色の文字が出た場合は下記記事をご覧くだい。

③マイグレート実行

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

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

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

Node.jsのインストール

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

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

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


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

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

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

さらにこのあと、npm installを実行して、ViteとLaravelプラグインを使い始めるために必要なものをインストールしておきます。

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

以上で基本の環境構築はおわり…と言いたいところですが、もう少し頑張って、環境を設定していきましょう。

JavascriptやCSSを使うための設定を行っていきます。認証機能なども入れておきましょう。

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

本記事では,2023年3月現在最も一般的と思われる Laravel Breezeを入れる方法をご紹介します。

Laravel Breezeでは、cssのフレームワークははTailwind CSSを使います。

なお既存プロジェクトにBreezeを入れると、既存のルート設定が消えてしまいますので、ご注意ください。詳細は下記をご覧ください。

ひとことメモ

認証機能は、Laravel7までは laravel/uiが使われていました。Laravel8になった時、Jetstreamが登場し、こちらが推奨となりました。

ですがjetstreamは高機能ながら使いにくいとの声がありました。そこで後から、Breezeが登場しました。今はBreezeが一般的な認証機能といえます。二段階認証などを行いたいときには、Jetstreamが便利です。

Breezeのインストール

まずは、コマンドプロンプトを立ち上げ、Laravelがインストールしてある場所(C:\xampp/htdocs/laravel/members)に移動します。

次のように入力します。

次の画面になります。

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

すると、3つの質問が順番に出てきます。

①まず「どのスタックをインストールしますか?」と質問が表示されます。Livewire等を使う予定が特になければ、一番上を選択します。
②「ダークモードサポートをインストールしますか?」と質問が表示されます。ダークモード(黒っぽい画面)を使用したい場合には、yesを選びます。そうでなければ、noを選びます。ここでは、「no」を選択します。
③テストフレームワークを選択します。ご希望に応じて選んでください。ここでは「1」(PHPUnit) を選択します。

質問が終わると、インストールがしばらく続きます。最後に「Breeze scaffolding installed successfully. 」と出てきます。

エラーの時の対応① severity vulnerabilities

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

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

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

こういった場合は、npm audit fixを実行した後、再度 インストールを実行してください。

エラーの時の対応② WARNINGS in child compilations

WARNINGS in child compilations とでることがあります。

このエラーの解決法は、こちらをご覧ください。

ブラウザで確認

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

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

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

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

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

Laravel Viteを起動する

2022年6月29日以降、BreezeまたはJetstreamパッケージでLaravelの最新版を入れると、Laravel Viteが入ってきます。

Laravel Viteは、フロントエンド・ビルド・ツールです。Tailwinds CSSやVue.jsを使ったフロントエンドの変更を自動でブラウザに反映してくれます。

Laravel Viteを起動するには、コマンドプロンプト等を立ち上げ、npm run devコマンドを実行します。コマンドプロンプトはこのままの状態にしておきます。

とめるには、コントロールボタンとCボタンを同時にクリックします。

Laravel Viteについては、下記動画でまとめています。「文字だけではイマイチ分からない!」と思ったら、動画も参考にしてくださいね。

Laravel Viteとは:Laravel Viteの使い方、役割、Laravel Mixとの違いを絵を使って分かりやすく解説
エラーの時の対応① 認識されていませんと出たら

「’vite’ は、内部コマンドまたは外部コマンド、操作可能なプログラムまたはバッチ ファイルとして認識されていません。」と出たら、npm installを実行してください。

Viteを使い始めるために必要なものをインストールできます。

エラー時の対応② npm run dev実行後、ロゴが大きく表示される場合

ロゴが大きく表示されてしまったり、レイアウトが崩れたら、Laravel Vite関連のエラーである可能性が高いです。上記から該当する記事を探してください。

またレイアウトが崩れている場合には、再読み込みを実施してみてください。Google Chromeの場合はF12を押した後、下記の再読み込みボタンをクリックし、【キャッシュの消去とハード再読み込み】を実行します。Ctrlキー+F5キーでも大丈夫です。

エラー時の対応③ そのほかのエラー

Laravel Viteのエラー対策はこちらにまとめています。

Laravelの初期設定を変更する

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

  • タイムゾーン
  • 言語

下記のライブラリを使用すると、タイムゾーンや言語の設定を変更し、日本語翻訳を進めてくれるので便利です。

「自分でちゃんと仕組みを知っておきたい」という場合は、下記をご参照ください。

タイムゾーンの変更

.envファイルの中に、タイムゾーンの設定が入っています。

【.env】

ここを次のようにしておきます。

config/app.phpの68行目あたりには、下記コードが入っています。

【config/app.php】

これは.env側で言語設定があれば、そちらが反映されます。なければconfig側の設定(UTC)が有効になるという意味です。

Laravel10の場合

以前はconfig/app.phpに設定をいれていました。config/app.php ファイルの70行目ぐらいに ‘timezone’ があるので、【Asia/Tokyo】と変更します。

言語の変更

.envファイルの中に、言語設定が入っています。

【.env】

ここを次のようにしておきます。

config/app.phpの81行目あたりには、下記コードが入っています。

【config/app.php】

これは.env側で言語設定があれば、そちらが反映されます。なければconfig側の設定が有効になるという意味です。

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

下記記事にまとめているので、参考にしてください。

Laravel10の場合

以前はconfig/app.phpに設定をいれていました。config/app.phpの83行目ぐらいに’locale’ があるので、こちらを【ja】と変更します。

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

エディタについて

もしコード編集用のエディタがまだない場合には、そちらもいれておきましょう。わたしはVisual Studio Codeというエディタを使っています。

Visual Sturio Codeについては、下記の記事を参考にしてください。

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

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

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

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

さいごに

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

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

なおインストール後にLaravelの使い方を知りたい人向けに、学習サイトを運営しています。Laravelの基本の使い方を学びつつ、フォーラムサイトを作っていける実践的な内容です。

学習サイトではLaravel10版に加え、Laravel8・Bootstrap版 と Laravel9・Breeze版(Tailwind CSS利用)をご用意しています。Laravel11版も現在作成中です。

基礎編部分は、無料です。

詳細は、こちらのご案内ページご覧ください。

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

Laravel入門講座

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

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

最新のLaravel10版テキストに加え、Laravel8版・Laravel9版もご用意しています♪

【無料プレゼント】

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

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

詳細はこちらをクリック

最新のLaravel10版テキストに加え、Laravel8版・Laravel9版もご用意しています♪

Laravelの本を書きました。


ひつじが目印♪
クリックするとamazonページへ。

Laravelの使い方を分かりやすく解説した書籍を出版しました。書店やAmazon等のオンラインショップにて販売中です。
Laravel10対応。Laravel11サポートガイドもご用意しています。詳しくは下記ボタンをクリック♪

書籍の詳細を見てみる

Laravelの本を書きました。


ひつじが目印♪
クリックするとamazonページへ。

Laravel10対応

Laravelの使い方を分かりやすく解説した書籍を出版しました。書店やAmazon等のオンラインショップにて販売中です。

書籍の詳細を見てみる

 

Laravelの教科書限定コミュニティ【Laravelの教科書ラボ】はじめました。
デプロイ講座付。StripeやChatGPT連携など過去10回分のセミナー動画視聴可能。

Laravel実践スキルをのばしたい方におすすめです。

ラボの案内を見てみる

Twitter始めました。
40代からプログラミング!

コメント

  1. koba より:

    C:\xampp\htdocs にプロジェクトを作ろうとしたのですが以下のエラーが出ます
    どうしたらいいでしょうか?

    In CurlDownloader.php line 365:

    curl error 60 while downloading https://repo.packagist.org/packages.json: SSL certificate problem: self-signed cert
    ificate in certificate chain

    • Junko Junko より:

      既にお試しかもですが、エラーメッセージを使ってググってみると、解決できそうな記事が出てきます。
      なおご質問はサポートサービスにて承ってます。
      ただ、環境構築系のエラーは、環境が異なると再現ができないことがあるため、サポート対象外とさせて頂いてます。
      本件についても、わたしのほうではエラーを再現できず、適切なことがお伝えできません。
      ご理解の程、よろしくお願い致します。

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