BLOG MENU

Share on

【入門】Dockerで環境構築｜WordPress環境をローカルPCに作ろう！

【入門】Dockerで環境構築｜WordPress環境をローカルPCに作ろう！

Webサイトの制作を進めるために必要なのが「ローカル環境」。

今回は、Dockerを使用してローカル環境を構築する手順を説明します。この手順を実行すると、5分程度で環境構築は完了です。ぜひ、手元のPCで実際に試しながら読んでください。

それでは、始めましょう！

Dockerで構築する環境の概要

今回、Dockerを使用して立てる環境は「LAMP&Wordpress&phpMyAdmin」が揃った環境となっています。

詳細情報は以下の通りです。

  • PHP 8.0.28
  • Apache 2.4.56 (Debian)
  • mysql 8.0
  • Wordpress 6.2

環境構築手順

Dockerによる環境構築は以下の6ステップです。

  1. Docker Desktopをインストール
  2. Docker Desktopを立ち上げる
  3. docker-compose.ymlファイル入れるディレクトリを作る
  4. 環境構築を始めるコマンドを実行
  5. 「docker-compose up -d」コマンドを実行
  6. 完成した環境の確認

Step1　Docker Desktopをインストールする

Docker docsから、お使いのOSに合ったDocker.dmgファイルをダウンロードしてください。Mac、Windows、Linuxのいずれかですね。

Docker Desktopをインストールする

Docker.dmgファイルがダウンロードできたら、インストールします。Macの場合は、ファイルをダブルクリックして開いて、Dockerのアイコンをドラッグ＆ドロップするだけです。

ファイルをダブルクリックして開いて、Dockerのアイコンをドラッグ＆ドロップ

Step2　Docker Desktopを立ち上げる

インストールができたら、Dockerのアイコンがあるはずです。これをクリックして 、Dockerを立ち上げてください。

Docker Desktopを立ち上げる

設定はデフォルトでOK。「Finish」をクリックします。

「Finish」をクリック

以下の画面になったら、起動完了です。

起動完了画面

Step3　docker-compose.ymlファイル入れるディレクトリを作る

WordPress環境を立ち上げるために新しくディレクトリ（フォルダ）を用意します。WordPress環境に必要な各種ファイルと、docker-compose.ymlファイルが格納される場所です。

docker-compose.ymlファイルとは？

ワードプレス環境を作るための命令が書かれているファイルです。このファイルの内容を実行して環境構築を行います。

どこに作ってもいいですが、Cドライブに近いところがおすすめです。今回は「Macintosh HD > ユーザー > user > パブリック」に作りました。

フォルダの名前はなんでもいいですが、あとで見てわかるようにしておきましょう。下の画像では「docker_test」としてあります。

docker-compose.ymlファイル入れるディレクトリを作る

Step4　docker-compose.ymlファイルを作る

作成したディレクトリ（フォルダ）内に「docker-compose.yml」ファイルを用意します。

お使いのテキストエディタを使って、新しくファイルを作成。名前を「docker-compose.yml」とします。VScodeでやるとこんな感じ。

docker-compose.ymlファイルを作る

ディレクトリ内にファイルが入りました。びっくりマークがついていますが、気にせずでOKです。

ディレクトリ内のファイルを確認する

ここまでできたら、今作った「docker-compose.yml」ファイルに以下のコードをコピペして「保存」してください。

  1. version: "3.7"
  3. services:
  4.  db:
  5.   image: mysql:8.0
  6.   container_name: mysql8
  7.   restart: always
  8.   environment:
  9.     MYSQL_ROOT_PASSWORD: password # rootユーザのパスワード
  10.     MYSQL_DATABASE: db_local # WordPress用データベース名
  11.     MYSQL_USER: wp_user # WordPress用データベース接続ユーザ名
  12.     MYSQL_PASSWORD: password # WordPress用データベース接続パスワード
  14.  WordPress:
  15.   image: wordpress:latest
  16.   container_name: wordpress
  17.   restart: always
  18.   depends_on:
  19.      - db
  20.   ports:
  21.      - 10090:80
  22.   environment:
  23.     WORDPRESS_DB_HOST: db:3306 # データベースサーバ名：ポート番号
  24.     WORDPRESS_DB_USER: wp_user # WordPress用データベース接続ユーザ名(dbの内容に合わせる)
  25.     WORDPRESS_DB_PASSWORD: password # WordPress用データベース接続パスワード(dbの内容に合わせる)
  26.     WORDPRESS_DB_NAME: db_local # WordPress用データベース名(dbの内容に合わせる)
  27.     WORDPRESS_DEBUG: 1 # デバッグモードON
  28.   volumes:
  29.      - ./html:/var/www/html
  31.  phpmyadmin:
  32.   image: phpmyadmin/phpmyadmin:latest
  33.   container_name: phpmyadmin_ingrid
  34.   restart: always
  35.   depends_on:
  36.      - db
  37.   ports:
  38.      - 10099:80

Step5　「docker-compose up -d」コマンドを実行

コマンドプロンプトを開いてください。「コマンドプロンプトって何？」という方のために、開き方を書いておきます。

  • Macの場合：Finder で「アプリケーション」＞「ユーティリティ」フォルダ内の「ターミナル」をダブルクリック
  • Windowsの場合：スタートボタンからアプリ一覧の「Windows システム ツール」内の「コマンド プロンプト」をクリック

コマンドを実行していきましょう。まずはymlファイルのあるディレクトリに移動します。コマンドは以下のとおり。

  1. cd [新規作成したディレクトリへのパス]

ここで注意するのは「ディレクトリへのパスの書き方」。今回は「cd /Users/user/Public/docker_test」となります。cdの後ろに半角スペースがあるので注意。

Macでのディレクトリパスの取得方法

Macでディレクトリパスを取得するには、対象のディレクトリ（フォルダ）を開いた状態で「command + option + c」でコピーできます。コピーしたら「command + v」で貼り付けてください。

実行してうまくいくと、下の画像のように移動先のフォルダの名前が表示されます。

Macでのディレクトリパスの取得方法

ここまでできたら、以下のコマンドを実行。環境構築が始まります。

  1. docker-compose up -d

うまくいかなかったら？

Dockerを起動してあるかチェックしてください。起動していないと命令が実行されません。私はこれで1時間悩みました。

正常に動くと、コマンドプロンプトは以下のようになります。

正常動作のコマンドプロンプト

環境構築には時間がかかりますので待ちましょう。完了するとDockerは以下のようになります。

Docker画面 環境構築完了

ディレクトリにはWordPress環境に必要なファイルが格納されています。下の画像では「html」です。

WordPress環境に必要なファイルが格納されたディレクトリ

Step6　完成した環境の確認

上のような状態になったら、phpMyAdminのURLにアクセスします。次のURLにアクセスしてください。
phpMyAdmin：https://admin.coosy.co.jp:10099

以下のようなページが開けばOKです。

phpMyAdmin アクセス画面

次にWordPressの画面をチェックします。以下のURLにアクセスしてください。
WordPress：https://admin.coosy.co.jp:10090

下のページが表示されれば環境構築は完了です。おつかれさまでした！

WordPress 言語設定画面

まとめ

以上、DockerでWordPressのローカル環境を構築する方法をお伝えしました。

Dockerはローカル環境を作成するのに非常に便利なツールです。使い方さえ覚えてしまえば、Wordpressの他にもさまざまな環境を構築することができます。

Dockerをうまく活用して、環境構築を手軽なものにしていきましょう！

Reactの環境を作りたい方はこちらの記事をご覧ください。今回の記事がわかったなら、すんなり理解できるはずです。

【DockerでReactの環境構築】エンジニア1年生と学ぶコンテナ構築までの手順

基本的なプロンプトはこちらの記事にまとめてあります。

Dockerとは？初心者のためにメリットと基本的な使い方を解説
クーシーブログ編集部

この記事を書いた人

クーシーブログ編集部

1999年に設立したweb制作会社。「ラクスル」「SUUMO」「スタディサプリ」など様々なサービスの立ち上げを支援。10,000ページ以上の大規模サイトの制作・運用や、年間約600件以上のプロジェクトに従事。クーシーブログ編集部では、数々のプロジェクトを成功に導いたメンバーが、Web制作・Webサービスに関するノウハウやハウツーを発信中。

お問い合わせはこちらから

Web制作デザイン、丸ごとお任せ

お問い合わせする

テキスト：小山倖之介、加藤久佳　デザイン：大坂間琴美

Share on

お問い合わせはこちら

COOSYの
制作実績

UIUXと美しさを両立させた、クーシーが誇る成功事例一覧。
課題解決のアイデア満載です。

制作実績を見る

CATEGORY LIST

ホーム