Laravelローカルに環境構築するロードマップ

こんにちは。フリーランス・コンサルタント&エンジニアの 九保すこひ です。

さてさて、私が15〜20年プログラミングをやっていて「うーん、初学者に優しくないよね…💦」と感じることがあります。

それが・・・・・・

環境構築(自分のパソコンでプログラムが動くようにすること)

です。

というのも、プログラミングの勉強をはじめるには環境構築しないといけませんが、後者の方がはるかに難しいからです。

※私はこれを「プログラミング学習のパラドックス」と言っています(笑)

例えば、JavaScriptだとブラウザに環境できているので、alert('test');と書けばアラートが表示されます。

しかし、Laravel(PHP)だとそうはいきません。
プログラミング言語からインストールしないといけないからですね。

今回とあるクライアントさんから「ローカル環境の構築をレクチャーしてほしい」とのご依頼があり、だったらロードマップだけでもつくっておこうと思いました。

つまり、この記事では以下のような内容をまとめています。

  • 自分のパソコンでLaravelが動くようにしたい
  • できるだけ簡単にLaravel環境構築をしたい
  • 環境構築の大まかな流れが知りたい

ぜひ最後まで読んでくださいね!

「姪っ子のおねだり攻撃があり、
Switch&マリオワンダー買ってしまった(笑)」

前提として

新しくLaravelをインストールするのではなく、すでにgitにソースコードがあり、途中からプロジェクトへ参加する場面を想定しています。

もちろんdockerを使ってもいいのですが、今回は対象外。

また、基本的にwindows向けに記事を書いています(長年Linuxを使ってるのでどこか変なところ&抜けがあるかも…ぜひX(Twitter)のDMでご指摘ください🙇)

アプリケーションの準備編:4ステップ

1:PHPが使えるようにする

LaravelPHPというプログラミング言語を使って動いています。

そのため、まずはPHPがパソコンで動くようにしないといけませんが、実際にはそれも含めて、

  • PHP:プログラミング言語
  • Apache:ブラウザでアクセスできるようにする
  • MySQL:データ保管庫

の3つが必要になってきます。

そこでこれらを一気にインストールできる以下のようなアプリを使うといいでしょう。

この記事ではXAMPPを前提として話をすすめますが、お好みでOKです!

※ちなみに私は2011年ぐらいまではwindowsを使っていて、その頃はXAMPPを愛用してました😊

インストールが完了したら、PHPやMySQLを起動させておいてください。

2:composerのインストール

composerとはPHPのパッケージ(日付だったり画像が簡単に使えるようになったりする便利なもの)を管理してくれるツールです。

Laravelのインストールもこのcomposerで行うことになりますので、インストールしておいてください。

【参考ページ】

3:npmのインストール

composerPHPのパッケージを管理していますが、npmJavaScript向けのパッケージマネージャです。

LaravelPHPなので直接は関係ないですが、近年はJavaScriptとの連携も多くなっているのでnpmもインストールしておきましょう。

【参考ページ】

4:git(git bash)のインストール

gitはソースコード(プログラミングで書いたコード)の共有ツールで、以下のようなことができます。

  • いつどこの瞬間のソースコードでも再現できる(時空間の移動みたいなイメージ)
  • 複数人で同じファイル変更しても(ほぼほぼ)OK
  • ソースコードの複製

プログラミングの開発にはgitは必須といってもいいので、これもインストールしておいてください(Laravelの準備編でも使います)

【参考ページ】

ちなみにgit bashをインストールすると、「ls」などのLinuxコマンドが使えるようになったりするので、Linuxコマンドに慣れてる人には便利ですよ!

コマンドは以下を参考にしてみてください。
Git Bash (Shell) – CDSS / Learn Git

Laravelの準備編:4ステップ

1:gitでソースコードをダウンロードする

今回は新しくLaravelをインストールするのではなく、すでにgitで管理されたコードで環境構築します。

まずはgitを通してソースコードをダウンロード(クローン)していきましょう。

Githubを使うことを想定してますが、基本はどのサイトでも同じです

まず管理されているGitHubURLにアクセスし、クローンするURLを取得しましょう。

たとえば、Laravelのページだとこのページにアクセスして「Code > Local」の部分に書かれています。

そして、git bashでルートフォルダ「c:\xampp\htdocs」へ移動します。

cd c:\xampp\htdocs

以下のコマンドを実行します。

git clone (ここに取得したURL)

たとえば、先ほど見たLaravelのページだと以下のようになります。

git clone https://github.com/laravel/laravel.git

なお、プライベートなソースコードの場合はアクセス権限が必要です。
その場合はGitHubからプロジェクトへ招待してもらうといいでしょう。

2:composerでパッケージをインストールする

git cloneすると新しくフォルダができるので、その中に

cd (あなたのフォルダ)

で移動します。

そして、composerで一気にパッケージをインストールします。

composer install

【追記:2024.10.10】

実際にレクチャーをしたところ、XAMPPPHPでは以下2つの拡張機能が有効になっていないため、composerでインストールができないようでした。

  • gd:画像向け拡張
  • zip:zipファイル向け拡張

これに対処するには、以下の手順を試してみてください。

  1. 「c:\xampp\php\php.ini」をメモ帳などで開く
  2. 拡張のコメントアウトを解除する※
  3. XAMPPコントロールパネルの「apache」を「stop」&「start」で再起動する

※解除する場所はこちら

【gd】

;extension=gd(←先頭の文字を削除する)
 ↓
extension=gd

【zip】

;extension=zip(←先頭の文字を削除する)
 ↓
extension=zip

もし項目がない場合は、追加してください。

4:環境変数ファイルを用意する

ここで言う環境変数とは、以下のような情報です。

  • データベースの接続情報
  • エラーを出す or 出さない
  • タイムゾーン

そして、git cloneした場合、Laravelの環境変数ファイル.envが存在していません。なぜなら.envファイルは各自用意することが前提だからですね。

ただし、.env.exampleファイルが用意されていますので、このファイルをコピーして.envファイルを作成すればOKです。

では、ファイルを作成したらPhpMyAdminなどで新しいデータベースをつくり、そこへ接続する情報をセットしてください。

.env

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=(ここに新しく作ったデータベースの名前)
DB_USERNAME=(ログインユーザー名)
DB_PASSWORD=(ログインパスワード)

たとえば、このようになります。

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=my-database
DB_USERNAME=admin
DB_PASSWORD=password123

3:秘密鍵をつくる

先ほどの.env.exampleの中身しだいですが、.envにはAPP_KEY(秘密鍵)がセットされていない場合があります。

これはログインパスワードなどを暗号化するためのキーだと考えてください。
つまりセキュリティ上重要なものです。

では、この秘密鍵を以下のコマンドでセットしてみましょう。

php artisan key:generate

成功すれば.envにキーがセットされています。

4:テーブルを作成する

では、この状態でデータベースへテーブルをつくりましょう。
以下のコマンドを実行してください。

php artisan migrate

これでLaravelの準備は完了です!

Laravel起動編:アクセスするだけ

といっても、XAMPPが起動されていれば現状でブラウザからアクセスすることができます。

URLは、http://localhost/(git cloneしてつくったフォルダ名)/publicです。

たとえば、git cloneしてできたフォルダ名がxxxだった場合、URLは、http://localhost/xxx/publicですね。

ただ、これだとサブフォルダにアクセスしないといけません。

もしhttp://example.comみたいに直にドメインでアクセスしたい場合は「バーチャルホスト」設定するといいです。

設定方法は以下を参考にしてください!

参考ページ:

おわりに

ということで、今回は基礎的な内容をお届けしました。

ぜひ「環境構築」という鬼門を初学者が乗り越えられたら嬉しいです😊

ぜひハッピーなプログラミング開発を体験してみてくださいね。

ではでは〜❗

「姪っ子のおねだり攻撃最後の言葉
『ご善処のほど、よろしくお願い申し上げます』
…いい営業になりそう(笑)」

このエントリーをはてなブックマークに追加       follow us in feedly  
開発のご依頼お待ちしております
開発のご依頼はこちらから: お問い合わせ
どうぞよろしくお願いいたします! by 九保すこひ