ChromebookでWordPressローカルサーバーを5分で用意する

事前準備

• Linuxベータ
• インターネット環境

これだけでOKです。

何かミス等でおかしくなっても、Chromebook自体には影響はないので安心してください。仮に失敗したとしても、Linux環境を一旦削除して再度作成すれば何回でもやり直しができます。

なお、すでに公開サーバーで動いているWordPressサイトを使うのであれば、「ブラウザからWordPressサイトにアクセスすればそのまま使えます」。この方法は、あくまでローカル環境にWordPressのテスト環境を構築する方法となりますのでご注意ください。

実演

Linuxに素のPHPやMySQLをインストールしても良いのですが、トラブルに遭遇する確率が高いのでDockerを使います。コマンドラインを使いますが、Linuxの知識がなくてもコマンドをコピペして打てば出来るように、出来るだけ簡素にガイドを書いていきます。

Dockerをインストール

まずは、Dockerをインストールします。

Linuxターミナルを開いて、下記のコマンドをコピーして実行（エンターキー）します。

sudo apt update -y

sudo apt install -y \
    apt-transport-https \
    ca-certificates \
    curl \
    gnupg2 \
    software-properties-common

curl -fsSL https://download.docker.com/linux/debian/gpg | sudo apt-key add -

sudo apt-key fingerprint 0EBFCD88

sudo add-apt-repository \
   "deb [arch=amd64] https://download.docker.com/linux/debian \
   $(lsb_release -cs) \
   stable"

sudo apt update -y

sudo apt install -y docker-ce docker-ce-cli containerd.io

sudo docker --version  
Docker version 19.03.12, build 48a66213fe

このコマンドが出来ればインストール完了です。

Docker-composeをインストール

続いて、Docker-composeをインストールします。本来なくても良い機能ですが、WordPressを一発で立ち上げることができるのでインストールしておきます。

sudo su

sudo curl -L "https://github.com/docker/compose/releases/download/1.26.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose

sudo chmod +x /usr/local/bin/docker-compose

sudo ln -s /usr/local/bin/docker-compose /usr/bin/docker-compose

docker-compose --version
docker-compose version 1.26.2, build 1110ad01

バージョンが表示されたら、

exit

でsudoを抜けます。

WordPress用docker-copmose.ymlの準備

WordPress用のdocker-copmose.ymlというファイルを用意します。

テキストエディタが必要ですが、インストールしていない場合もあるので、コマンドラインから作成します。

任意の場所で、

vi docker-compose.yml

と打ちます。

viエディタが立ち上がるので、キーボードのiキーを押して入力モードに入って、

ctrl + shift + v

で下記のテキストをペーストします。

version: '3.1'

services:

  wordpress:
    image: wordpress
    restart: always
    ports:
      - 8080:80
    environment:
      WORDPRESS_DB_HOST: db
      WORDPRESS_DB_USER: exampleuser
      WORDPRESS_DB_PASSWORD: examplepass
      WORDPRESS_DB_NAME: exampledb
    volumes:
      - wordpress:/var/www/html

  db:
    image: mysql:5.7
    restart: always
    environment:
      MYSQL_DATABASE: exampledb
      MYSQL_USER: exampleuser
      MYSQL_PASSWORD: examplepass
      MYSQL_RANDOM_ROOT_PASSWORD: '1'
    volumes:
      - db:/var/lib/mysql

volumes:
  wordpress:
  db:

ペーストできたら、

• ESCキー
• :キー
• wqと入力
• エンター

の順番でキーを押して、ファイルを保存します。

ターミナルの画面に戻ればWordPress用のdocker-compose.ymlファイルの作成成功です。

WordPress Dockerコンテナを起動

ここまでできたら終わったも同然です。

sudo docker-compose up -d

でコンテナを起動します。

sudo docker-compose up -d
Creating network "wordpress_default" with the default driver
Creating volume "wordpress_wordpress" with default driver
Creating volume "wordpress_db" with default driver
Pulling wordpress (wordpress:)...
latest: Pulling from library/wordpress
8559a31e96f4: Already exists
e0276193a084: Pull complete
eb2d00c10344: Pull complete
f54006e0dc29: Pull complete
e0d3d1244592: Pull complete
3a60f364b0c5: Pull complete
3e309988c00b: Pull complete
42c09ef39fe7: Pull complete
8faf60068506: Pull complete
c59965a5777f: Pull complete
db37570cfdf4: Pull complete
2c289722ebb3: Pull complete
491a234e2c26: Pull complete
944a23d0ea39: Pull complete
b83f4c8507f7: Pull complete
e80a84c5a269: Pull complete
267943a2fe25: Pull complete
a7780c30584c: Pull complete
ed59c3cd6acc: Pull complete
a650de05eb1e: Pull complete
Digest: sha256:ca4e9b3078ce3497cfbadea6df299a6c46fceddc7eac04958207ef3e4d2edaa8
Status: Downloaded newer image for wordpress:latest
Creating wordpress_wordpress_1 ... done
Creating wordpress_db_1        ... done

こんな感じでコマンドラインが流れてくれば起動完了です。

ローカルWordPressにアクセス

立ち上げたWordPressサーバーは、localhost:8080というアドレスを持っているので、ブラウザでアクセスします。

無事立ち上がっていますね。

あとは、いつも通りWordPressの設定を進めればOKです。

ChromebookでWordPressディレクトリを操作する

WordPressのテーマを編集したりconfigファイルを設定する際は、WordPressディレクトリを操作することになります。

WordPressディレクトリはどこにある？

LinuxコンテナのDockerでWordPress環境を構築した際は、

1. ChromebookのLinux環境の中の
2. WordPressコンテナの中

にWordPressディレクトリが存在します。ここは普通のDockerと同じです。

今回ご紹介したdocker-compose.ymlでは、

volumes:
  - wordpress:/var/www/html

の部分で、

1. Linux環境内の
2. docker-compose.ymlと同じディレクトリにある
3. 「wordpress」ディレクトリを
4. WordPressコンテナの「/var/www/html」をリンク

しているので、Linuxコンテナ側の当該ディレクトリでファイルを操作すれば、コンテナ内のwp-contentなどのファイルも変更可能です。リンクしているので、変更内容は基本的にリアルタイムで反映されます。

リンクするディレクトリにWordPressデータは入れておくべき？

なお、コンテナを立ち上げるときは、「wordpress」ディレクトリがなくても、「wordpress」ディレクトリの中にwp-contentなどのWordPress関連ファイルがなくても、コンテナが自動生成します。

ただし、Dockerコンテナが作成したファイルは基本的にroot権限で作成されるので、後述するChrome OSからファイル操作が出来なくなります。

その際は、Linux環境側でWordPressディレクトリの権限をユーザーに設定すれば解決できます。

どのディレクトリとリンクしているかわからなくなったら

もし、すでにdocker-composeでコンテナ群を起動していて、どこのコンテナがChromebookのLinux環境のどのディレクトリとリンクしているかがわからなくなった場合は、docker inspectコマンドでリンク先を確認できます。

sudo docker ps

でコンテナIDを取得して、

sudo docker inspect コンテナ　ID

で設定を表示します。「Mounts」の項目がローカル環境とリンクしている部分です。Destinationが「/var/www/html」のSourceが、Linux環境のリンクしているディレクトリです。

"Mounts": [
    {
        "Type": "bind",
        "Source": "/home/hogehoge/Docker/wordpress",
        "Destination": "/var/www/html",
        "Mode": "rw",
        "RW": true,
        "Propagation": "rprivate"
    }
],

上の例の場合は、「/home/hogehoge/Docker/wordpress」とリンクしていることがわかります。

もし、「volumesで指定したディレクトリを操作しているのに、変更されない」と言う場合も、ここをチェックしましょう。注意すべきは、「Linux環境内のディレクトリ」とリンクしている点で、Chrome OS内のディレクトリ（ダウンロードなど）とは異なります。

この辺りは、Chrome OSの知識というよりDockerの知識になってくるので、Dockerについても学習すると良いでしょう。

WordPressディレクトリをChrome OSから操作したい時

ディレクトリの場所がわかったら、Linux環境ではなく、Chrome OS側からファイルを追加したりしたくなります。

Chrome OSでは、Linux環境をインストールした時点で「ファイル」アプリで「Linuxファイル」というタブが追加されて、Linux環境のユーザールートを表示するようになっています。

ですので、WordPressディレクトリをユーザールート上に作っていれば、普通のChrome OSのファイルとして操作可能です。

ユーザールートから外れたディレクトリにWordPressディレクトリを設定すると、権限不足で表示が出来なかったり、操作が出来なかったりするため、Chrome OS側からも操作をするなら、Linux環境のユーザールートにWordPressディレクトリを作成するようにしましょう。

一度ログアウト・電源オフをした場合

今回作成したWordPressコンテナは自動で再起動するようになっていますが、ChromebookではLinux環境は何か一つのLinuxアプリを明示的に起動しないとLinux環境自体がスリープしているので、WordPressサーバーも立ち上がりません。

ですので、一度ログアウトや電源オフをした場合は、Linuxターミナルを立ち上げてください。立ち上げたあとは最小化しておけばOKです。

---

ChromebookでWordPressローカルサーバーを立ち上げてみました。

インタネット回線の速度やChromebookのスペック次第で5分以上かかってしまうこともあるかと思いますが、概ね10分くらいでは用意できるかと思います。