お手軽に Laravel ローカル開発環境を構築(Laradock 編)


今回作成する環境構成

名前 バージョン
PHP 7.3.27
Laravel 8.32.1
Laradock v11.0 (2020/06/18)
  • VSCode のプラグイン
    • PHP Debug
    • PHP IntelliSense

まずは Web サーバーを準備

ここで登場するのが Laradock です。公式には以下のように記載があります。

Laradockは、Docker用の完全なPHP開発環境です。
さまざまな一般的なサービスをサポートし、すべてがすぐに使用できるPHP開発環境を提供するように事前構成されています。

本当にいろいろなコンテナLaradock には入っているのですが、今回使うのは nginxmysql になります。

アプリケーション用のディレクトリを作成します。

mkdir -p ~/Desktop/workspace && cd ~/Desktop/workspace

今回準備するディレクトリ構成は以下の通りを想定しています。

└── workspace
    ├── laradock  ← Laradock本体
    └── myproject1 ← コンテナ(Laradock)とディレクトリ共有しているLaravelアプリケーション

Laradock を Clone します。

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

.env を編集します。

.env
cd laradock
cp env-example .env

以下の項目を編集してください。

.env
NGINX_HOST_HTTP_PORT=80
↓ 80番ボートは何かと被ることが多いので未使用ポートに変更する
NGINX_HOST_HTTP_PORT=8100

Laradock は起動したいコンテナを引数に渡してあげれば起動できる仕組みになっていて、今回は冒頭で説明した通り nginx と mysql を指定します。

docker-compose up -d nginx mysql

http://localhost:8100 にアクセスします。
まだアプリケーションが空なので、404ページが表示されますが、これで正常にWebサーバーが構築できたことは確認できました。

Laravel をインストール

コンテナにアタッチしてから Laravel をインストールします。

docker exec -it laradock_workspace_1 bash
composer create-project laravel/laravel myproject1

.env を編集します。
以下の項目を編集してください。

.env
APP_CODE_PATH_HOST=../
↓
APP_CODE_PATH_HOST=../myproject1/

設定を反映します。

docker-compose down
docker-compose up -d nginx mysql

http://localhost:8100 にアクセスし、以下の画面が開けばインストールは完了です。

デバッグ(xdebug)の設定

.env を以下の通り編集してください。

.env
WORKSPACE_INSTALL_XDEBUG=false
PHP_FPM_INSTALL_XDEBUG=falseWORKSPACE_INSTALL_XDEBUG=true
PHP_FPM_INSTALL_XDEBUG=true

以下の xdebug.ini を編集します。(2ファイルあります。)

  • workspace/xdebug.ini
  • php-fpm/xdebug.ini
xdebug.ini
xdebug.idekey=PHPSTORM
xdebug.remote_autostart=0
xdebug.remote_enable=0
↓
xdebug.idekey=Listen for XDebug
xdebug.remote_autostart=1
xdebug.remote_enable=1

インストールした Laravellaunch.json を設定します。

  • myproject1/.vscode/launch.json
launch.json
{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Listen for XDebug",
      "type": "php",
      "request": "launch",
      "port": 9000,
      "pathMappings": {
        "/var/www":"${workspaceFolder}"
      }
    }
  ]
}

設定を反映します。

docker-compose down
docker-compose up -d nginx mysql

デバッグしてみます

できました。