Hello, I am Kosuke.

Docker Compose で WordPress の開発環境を構築する方法

どうも、こうすけ(@kosuke_upd)です。

今回は、Docker Compose による WordPress の日本語の開発環境の構築方法を解説します。

WordPress の開発環境といえば MAMP を使用したものがよく知られていると思いますが、Docker を使ってもさくっと簡単に作れてしまうんです。プログラミングができる人からすると、Docker を用いた開発環境のほうがサクサク開発を行えます。

加えて、Docker の中でも Docker Compose を用いることでより簡単に開発環境を構築できます。通常の Docker だとコンテナ同士を関連付けたり、起動する順番に気をつけたりする必要がありますが、Docker Compose を利用することでそれらの手間は一切不要になるからです。

というわけで、Docker Compose を用いた WordPress の開発環境の構築手順を一つひとつ丁寧に説明していくので、順番に見ていきましょう。

手順1. Docker と Docker Compose をインストール

まずは Docker と Docker Compose をインストールしましょう。

Docker for Mac (または Windows) というデスクトップアプリケーションをインストールすることで、Docker と同時に Docker Compose をインストールできるのでおすすめです。

Docker for Mac のインストール方法はこちらを参考にしてみてください。

DockerをMacにインストールする方法

手順2. プロジェクトディレクトリを作成し移動

Docker と Docker Compose をインストールできたら、次はターミナルで下記コマンドを実行し、プロジェクトディレクトリを作成し、移動しましょう。

$ mkdir sample-project
$ cd sample-project

手順3. docker-compose.yml ファイルを作成

プロジェクトディレクトリを作成し、移動したら、下記コマンドを実行しプロジェクトディレクトリ内に docker-compose.yml ファイルを作成しましょう。

$ touch docker-compose.yml
docker-compose.yml について

docker-compose.yml ファイル内にコンテナの情報を記述することで、コマンド実行時に Docker イメージを自動でダウンロードしてくれます。

手順4. コンテナ情報を docker-compose.yml に記述

では、作成した docker-compose.yml ファイル内に、ダウンロードしたいコンテナ情報を記述しましょう。

ここでは、WordPress の開発環境を構築する際に必要となる WordPress と MySQL のDocker 公式イメージを使用します。そのため、公式をもとにこれらの基本的なコンテナ情報を docker-compose.yml に記述しましょう。

docker-compose.yml
version: '3.3'

services:
  db:
    image: mysql:5.7
    volumes:
      - db_data:/var/lib/mysql
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: somewordpress
      MYSQL_DATABASE: wordpress
      MYSQL_USER: wordpress
      MYSQL_PASSWORD: wordpress

  wordpress:
    depends_on:
      - db
    image: wordpress:latest
    ports:
      - '8000:80'
    restart: always
    environment:
      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_USER: wordpress
      WORDPRESS_DB_PASSWORD: wordpress
      WORDPRESS_DB_NAME: wordpress
volumes:
  db_data: {}

手順5. その他必要情報を docker-compose.yml に追記

手順4では、WordPress と MySQL の基本的なコンテナ情報を記述しましたが、その他記述しておくと良い付加情報を追記していきます。

手順5-1. コンテナに名前をつける

デフォルト状態では、DB コンテナには wp_db_1、WordPress コンテナには wp_wordpress_1 といった名前が付けられてしまい、どのプロジェクトで使っているものかわかりづらくなってしまいます。

そのため、下記のようにそれぞれのコンテナにわかりやすい名前を付けておくと良いです。

docker-compose.yml
  db:
    image: mysql:5.7
    container_name: wp_db_sample
		
- 略 -

  wordpress:
    depends_on:
      - db
    image: wordpress:latest
    container_name: wp_wordpress_sample

手順5-2. 開発ディレクトリを volume としてマウントする

Docker では、ホストマシンの任意のディレクトリをコンテナ内のディレクトリとマウント (同期) させることができます。このマウントされた領域を volume と言います。

ホストマシン側で WordPress 内を編集しながらコンテナに同期させるのが一般的であり、開発も楽になります。

下記のように記述し、開発ディレクトリを volume としてコンテナにマウントさせましょう。

docker-compose.yml
  wordpress:

- 略 -

    volumes:
      - "$PWD:/var/www/html"
      - "$PWD/.docker/backup:/tmp/backup"
      - "$PWD/.docker/log:/tmp/log"

手順5-3. アクセスポートを変更する (任意)

デフォルトでは、アクセスポートは 8000 番となっており、ブラウザから http://localhost:8000/ にアクセスすることで WordPress トップページを確認することができます。

しかし、もしすでに 8000 番が他で使われている場合は、アクセスポートを変更する必要があります。例えば 9000 番に変更したい場合は、下記のように記述しましょう。この場合、http://localhost:9000/ にアクセスすることで WordPress トップページを開くことができます。

docker-compose.yml
  wordpress:

- 略 -

    ports:
      - "9000:80"
補足

当記事では、アクセスポート 8000 番のまま進めていきます。

手順5-4. DB アカウント情報などを別ファイルに定義

DB_USERDB_PASSWORD などの DB アカウント情報は別ファイルに定義することでセキュリティを高めましょう。

まず下記コマンドを実行し、プロジェクトディレクトリ直下に .env ファイルを作成します。

$ touch .env

そして docker-compose.yml 内の下記箇所を探します。

docker-compose.yml
  db:

- 略 -

    environment:
      MYSQL_ROOT_PASSWORD: somewordpress
      MYSQL_DATABASE: wordpress
      MYSQL_USER: wordpress
      MYSQL_PASSWORD: wordpress

上記の environment: から始まる 5 行を下記のように書き換えます。

docker-compose.yml
  db:

- 略 -

    env_file: .env

下記の箇所も同様に書き換えます。ただし、先程とは若干異なります。

docker-compose.yml
  wordpress:

- 略 -

    environment:
      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_USER: wordpress
      WORDPRESS_DB_PASSWORD: wordpress
      WORDPRESS_DB_NAME: wordpress

上記の environment: から始まる 5 行を下記のように書き換えます。

docker-compose.yml
  wordpress:

- 略 -

    environment:
      WORDPRESS_DB_HOST: db:3306
    env_file: .env

その後、書き換え前のものを先程作成した .env ファイル内に下記のように移します。

.env
MYSQL_ROOT_PASSWORD=somewordpress
MYSQL_DATABASE=wordpress
MYSQL_USER=wordpress
MYSQL_PASSWORD=wordpress

WORDPRESS_DB_USER=wordpress
WORDPRESS_DB_PASSWORD=wordpress
WORDPRESS_DB_NAME=wordpress

手順6. docker-compose.yml ファイル内を確認

では、もろもろ記述した docker-compose.yml ファイル内を確認しましょう。最終的に下記のようになっていると思います。

docker-compose.yml
version: "3.3"

services:
  db:
    image: mysql:5.7
    container_name: wp_db_sample
    volumes:
      - db_data:/var/lib/mysql
    restart: always
    env_file: .env

  wordpress:
    depends_on:
      - db
    image: wordpress:latest
    container_name: wp_wordpress_sample
    volumes:
      - "$PWD:/var/www/html"
      - "$PWD/.docker/backup:/tmp/backup"
      - "$PWD/.docker/log:/tmp/log"
    ports:
      - "8000:80"
    restart: always
    environment:
      WORDPRESS_DB_HOST: db:3306
    env_file: .env
volumes:
  db_data: {}

手順7. docker-compose.yml をもとに build する

では、下記コマンドを実行し、docker-compose.yml をもとに build しましょう。

$ docker-compose up -d

build が完了したら、いくつか確認してみましょう。

まず下記コマンドを実行し、WordPress と MySQL の image が作られたことを確認しましょう。

$ docker image ls
REPOSITORY          TAG                 IMAGE ID            CREATED             SIZE
wordpress           latest              837092bc87de        4 days ago          421MB
mysql               5.7                 98455b9624a9        2 weeks ago         372MB

次は下記コマンドを実行し、WordPress と MySQL のコンテナが立ち上がっていることを確認しましょう。STATUS の部分が Up になっていれば、コンテナが立ち上がっている証拠です。

$ docker container ls -a
CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS                  NAMES
88de0b053ea8        wordpress:latest    "docker-entrypoint.s…"   2 minutes ago       Up 2 minutes        0.0.0.0:8000->80/tcp   wp_wordpress_sample
a4d73a16f8d5        mysql:5.7           "docker-entrypoint.s…"   2 minutes ago       Up 2 minutes        3306/tcp, 33060/tcp    wp_db_sample

手順8. ディレクトリ構成を確認

では、ビルド後のプロジェクトディレクトリ配下のディレクトリ構成を確認してみましょう。以上の通りに進めていけば、下記のようなディレクトリ構成になっているはずです。

ディレクトリ構成
sample-project
├── .docker
├── wp-admin
├── wp-content
├── wp-includes
├── .env
├── .htaccess
├── docker-compose.yml
├── index.php
├── license.txt
├── readme.html
├── wp-activate.php
├── wp-blog-header.php
├── wp-comments-post.php
├── wp-config-sample.php
├── wp-config.php
├── wp-cron.php
├── wp-links-opml.php
├── wp-load.php
├── wp-login.php
├── wp-mail.php
├── wp-settings.php
├── wp-signup.php
├── wp-trackback.php
└── xmlrpc.php

手順9. ブラウザで WordPress トップページにアクセス

コンテナが起動しているので、ブラウザから http://localhost:8000/ にアクセスして WordPress のトップページを開きましょう。

http://localhost:8000 にアクセス

下記のような画面が開くはずです。

手順10. WordPress の初期設定を済ませる

WordPress の初期設定を済ませましょう。

こちらの画面にて、「日本語」を選択し、「続ける」をクリックしましょう。


サイトタイトル、ユーザー情報を入力し、「WordPress をインストール」をクリックしましょう。


「ログイン」をクリックしましょう。


ログイン画面が開くので、先程入力したユーザー情報でログインしましょう。


WordPress のダッシュボードが開きました。以上で Docker Compose による WordPress の開発環境構築の完了です。

Docker Compose の基本的操作: コンテナの起動・停止・削除

では最後に、Docker Compose による WordPress 開発環境の基本的な操作を見ておきましょう。

コンテナの起動

コンテナを起動するには、下記コマンドを実行しましょう。

$ docker-compose start

または、下記コマンドでもコンテナを起動できます。

$ docker-compose up

コンテナの停止

コンテナを停止するには、下記コマンドを実行しましょう。

$ docker-compose stop
補足

コンテナの停止では、コンテナ自体は削除されないため、再起動しても設定内容や DB データは保持されています。

コンテナの削除

コンテナを削除するには、下記コマンドを実行しましょう。

$ docker-compose down
補足

コンテナの削除では、コンテナが削除されるため、設定内容や DB データも削除されます。

Docker を用いてサクサク WordPress の開発をしよう

今回は、Docker Compose を用いた WordPress の開発環境の構築方法を解説しました。

Docker を用いることで、WordPress の開発をサクサク行うことができるので、これを機に WordPress の開発環境を Docker に移行してみましょう。

1 COMMENT

Akihiro

初めまして。フロントエンド開発初心者の者です。当記事を参考にdockerの開発環境を構築してみました。

wordpressのパスワードの設定時にsafariから推奨されるランダムなパスワードを設定してしまい、パスワードを保存しなかった為に、管理画面にアクセスできなくなってしまいました。
docker-compose down、docker rmi イメージIDで『コンテナ』と『イメージ』を削除し、docker-compose.ymlの

services:
db:
image: mysql:5.7
container_name: ココ!!

wordpress:
depends_on:
– db
image: wordpress:latest
container_name: ココ!!

を書き換えて、docker-compose up -d した所、初期で失敗した(wordpressのパスワードの設定時にsafariから推奨されるランダムなパスワードを設定した)wordpressが立ち上がってしまいます。

これは初期の設定がどこかに残ってしまってる為なのでしょうか??

また、.envファイルの

MYSQL_ROOT_PASSWORD=somewordpress
MYSQL_DATABASE=ココ!!??
MYSQL_USER=wordpress
MYSQL_PASSWORD=wordpress

WORDPRESS_DB_USER=wordpress
WORDPRESS_DB_PASSWORD=wordpress
WORDPRESS_DB_NAME=ココ!!??

を書き換えてdocker-compose up-d しなおせばよろしいでしょうか??

ご教示頂けると幸いです…。

返信する

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です