高速Wordpress構築へのTIPS　Dockerによるローカル環境

サマリ
目的
手法比較と選定理由
実施内容
AWS Lightsail

サマリ

Dockerを使ってWordpressのローカル開発環境を手早く作ることができた。Dockerが入っていれば、ymlをコピペしてWordpress初期設定するまでに30分かからないと思う。

ただアップロード上限値やボリュームの設定しておかないとWordpressを起動した後に詰まるので、転ばぬ先の杖としていくつかの設定が必要。

目的

サーバーやドメインに課金する前に、Wordpressでやりたいことができるのかローカル環境でパパっと確認したい。 Dockerで構築するにあたり、そこまで複雑ではないが、実際にWordpressを使う段でつまりどころがあった。次回以降速攻でできるように.ymlとか手順を、備忘録としてまとめておく。

手法比較と選定理由

　XAMPP

f:id:yoshi_2210:20220409102031p:plain — XAMPP logo

　ローカル環境構築における有名どころで、下記の頭文字を取ってXAMPP。

X：クロスプラットフォーム
A：Apache（WEBサーバー）
M：MySQL（データベース）
P：PHP（プログラミング言語）   
P：Perl（プログラミング言語）

過去にXAMPPで構築したことあるので、今回はパス。

　Docker

f:id:yoshi_2210:20220409102059p:plain — Docker logo

本命、細かい説明はさておきXAMPPで作るApacheとかMySQLとかはコンテナ(service)として扱い、Dockerイメージとしてまとめてポンしたい。 https://tech-lab.sios.jp/archives/18811

　その他

上の二つ以外にも、色んなサービスがある模様だが今回はDockerつかってみたいだけなので棄却した。

【超簡単】Local by Flywheelを使ってWordPressのローカル環境を構築する | 【運用・改善が得意な仙台のホームページ制作会社】AndHA（アンドエイチエー）

実施内容

　環境前提

Windows 64 bit
Docker Desktop version 4.6.1
docker version 4.6.1 (76265) Engine 20.10.13

　Dockerをインストールする

docs.docker.jp

Docker Desktopには、 Docker Engine 、 Docker CLI クライアント、 Docker Compose 、 Notary 、 Kubernetes 、Credential Helperは含まれている。

　作業ディレクトリを作成する

適当な場所に作業用フォロダを用意する。さすがにCドライブ直下はどうかと思うが、デスクトップとかでも別にいい。パスに日本語は入らないようには気を遣っているが、多分これに関しては杞憂。

　php.iniとdocker-compose.ymlを作業用ディレクトリ直下に作成する

詳細は下記の参考記事にて。つまり.ymlとは設計指示書である。実際のコードは公式ページを参考に作成した。WebサーバーやPHPはWordpressのイメージに含まれてるらしい。

【連載】世界一わかりみが深いコンテナ & Docker入門〜その4:docker-composeってなに？〜 | SIOS Tech. Lab
クィックスタート: Compose と WordPress — Docker-docs-ja 19.03 ドキュメント

個人的なポイントは、①”php.ini”と②”Volume”の定義だ。

ローカル環境でDocker×WordPressが重い問題を解決する - ブレインログ

①php.iniファイルを事前につくるのは、アップロード上限を引き上げるため。これがないと、あとあとWordpressにテーマとかアップロードするときに引っかかる。

# php.ini
upload_max_filesize = 500M
post_max_size = 500M

②VolumeとはDockerが作る環境側ではなくホストOS（普段使っている方）側にもっておくデータのこと。各所で指摘されている通り、全Wordpressのファイルを同期する設定ではホントに遅い。死ぬ。Wordpressで編集するはほぼ子テーマのフォルダだと思うのでそれを指定した。

# docker-compose.yml
    version: '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
        # volumesの追記は任意
        volumes:
        # - .:/var/www/html 
        - wp_data:/var/www/html 
        - ./wp-content/themes/cocoon-child-master:/var/www/html/wp-content/themes/cocoon-child-master #Cocoon前提
        - ./php.ini:/usr/local/etc/php/conf.d/php.ini
        ports:
        - "8000:80"
        restart: always
        environment:
        WORDPRESS_DB_HOST: db:3306
        WORDPRESS_DB_USER: wordpress
        WORDPRESS_DB_PASSWORD: wordpress
    volumes:
        db_data:
        wp_data: #追加

　Dockerを起動する

これで準備は整った。作業用ディレクトリでターミナル/コマンドプロンプトを起動して呪文を唱える。

    docker-compose up -d

　ローカルのアクセスを確認して、WordPressインストールする

あとは指定したポートに注意してhttp://localhost:8000/ にアクセスしてWordpressのインストール画面になればOK。

サイトの言語設定や名前とかPWは、ローカル環境だから自分がわかりやすいように設定すればよいと思う。

　環境の立ち上げと停止方法

コマンドなら下記。Docker Desktopなら停止・再開ボタンをクリックすれば良いので楽。

    #停止コマンド
    docker-compose -f docker-compose.yml down
    #再起動コマンド
    docker-compose -f docker-compose.yml up -d

最悪、ゾンビ化したり挙動がおかしくなったら、Docker Desktopからでもパージすればよい。スクラップ&ビルドしても痛くも痒くもないのがいいですね。

　Wordpressの作りこみ

あとはCocoonの親テーマ子テーマ両方インストールして、子テーマを有効化して作業開始できる。どうWordpressを作るかは別記事で。

AWS Lightsail

今回は自身の備忘録のためにまとめたが、改めて勉強にもなった。次回は、AWS lightsailをつかったドメイン付きWebサイトの高速構築を纏めたい。