はじめに
VSCodeのDevContainer機能を使うことで、Dockerを活用した開発環境を簡単に構築でき、プロジェクトごとに異なる環境を手軽に管理できます。この記事では、VSCodeのDevContainerでWordPressを使用するための手順を解説します。
前提条件
- VSCodeがインストール済みであること
- Dockerがインストール済みで動作していること
- VSCode拡張機能「Remote – Containers」がインストール済みであること
詳しいインストール方法などは以下の記事で紹介しています。
プロジェクトディレクトリの準備
まず、WordPressプロジェクト用のディレクトリを作成します。例えば、my-wordpress-project
という名前のディレクトリを作成します。
mkdir my-wordpress-project
cd my-wordpress-project
DevContainerの設定ファイルを作成
プロジェクトディレクトリに .devcontainer
フォルダーを作成し、その中に devcontainer.json
ファイルと Dockerfile
を作成します。
devcontainer.jsonの設定
このファイルは、コンテナ環境をVSCodeでどのように設定するかを定義します。
{
"name": "WordPress DevContainer",
"dockerComposeFile": "docker-compose.yml",
"service": "wordpress",
"workspaceFolder": "/var/www/html",
"settings": {
"terminal.integrated.shell.linux": "/bin/bash"
},
"extensions": [
"ms-azuretools.vscode-docker",
"wordpress.wordpress-snippet"
]
}
Dockerfileの設定
Dockerfileは、コンテナのベースイメージを定義し、必要なパッケージを追加インストールするために使用します。
FROM wordpress:latest
RUN apt-get update && apt-get install -y vim
Docker Composeファイルの作成
プロジェクトディレクトリのルートに docker-compose.yml
ファイルを作成します。このファイルでは、WordPressとデータベース(MySQL)を連携させるためのサービスを定義します。
version: '3.1'
services:
wordpress:
image: wordpress:latest
ports:
- "8000:80"
volumes:
- ./wordpress:/var/www/html
environment:
WORDPRESS_DB_HOST: db
WORDPRESS_DB_NAME: wordpress
WORDPRESS_DB_USER: user
WORDPRESS_DB_PASSWORD: password
db:
image: mysql:5.7
volumes:
- db_data:/var/lib/mysql
environment:
MYSQL_ROOT_PASSWORD: root_password
MYSQL_DATABASE: wordpress
MYSQL_USER: user
MYSQL_PASSWORD: password
volumes:
db_data:
DevContainerのビルドと起動
VSCodeでプロジェクトフォルダーを開き、コマンドパレット (Ctrl+Shift+P
または Cmd+Shift+P
) を使用して「Remote-Containers: Reopen in Container」を選択します。これにより、VSCodeがDockerコンテナ内でプロジェクトを開きます。
WordPressのセットアップ
コンテナが起動したら、ブラウザで http://localhost:8000
にアクセスし、WordPressのセットアップを行います。通常通り、サイトのタイトルや管理者アカウントを設定すれば、開発環境が整います。
トラブルシューティング
もし http://localhost:8000
でアクセスできない場合は、以下を確認してください:
- コンテナが正しく起動しているか起動時にログを開いて確認する
- ポート8000が他のプロセスで使用されていないか確認する(別ポートに変えてみる)
起動に時間がかかることもあるので、しばらく待つとうまくいくこともあります。
以上で、VSCodeのDevContainerを使ってWordPressの開発環境を構築する手順が完了しました。DevContainerを利用することで、複雑な依存関係や環境設定を簡単に管理でき、開発がスムーズに進むようになります。
WordPressのプラグイン開発やテーマカスタマイズを行う際にも、この環境は非常に便利です。ぜひ試してみてください!
DB操作に便利なphpadminを導入したい場合は、以下の記事でやり方を紹介しています。