Windows上でWordPressテーマ/プラグイン開発環境を構築【WSL2でお気楽Web開発】

Staff Note

Windows上でWordPressテーマ/プラグイン開発環境を構築【WSL2でお気楽Web開発】

Web開発者の皆さん、こんにちは!

前回「Windows上でLinux仮想環境を構築【WSL2でお気楽Web開発】」では、Windows上でLinux仮想環境を簡単に構築できる「Linux用Windowsサブシステム」を使い、Ubuntu環境を構築して、Apache WebサーバーとPHPのインストールを行いました。

今回は、更に進めてMariaDB、PhpMyadminをインストールして、WordPressを構築してみたいと思います。

Windows上でWordPressが動くのは不思議な感じがしますね。でも、そのことでFTP等でいちいちLinuxサーバーに作成中のファイルを同期すること無く、Windowsのパワフルな開発ツールで直接、WordPressテーマやプラグインの開発が可能となります。

また、手元で開発が済んだテーマやプラグインをインターネット上での公開するなら、レンタルサーバーを使うと便利です。

特におすすめなのがコアサーバーです。トラフィックの増加やセキュリティのリスクにも対応しているので安心です。

ぜひレンタルサーバー最高クラスのコストパフォーマンスを誇るコアサーバーをご利用ください。

ブラックフライデーセール開催中!月額220円~

コアサーバー公式サイトをみる

MariaDBインストールと初期設定

MariaDBのインストールから手順を説明して行きたいと思います。

インストールと初期設定

1.MariaDBインストール

tech@DIGIROCK-PC:~$ sudo apt update

※パスワードを聞かれたら、一般ユーザー名「tech」のパスワードを入力

tech@DIGIROCK-PC:~$ sudo apt install mariadb-server

※Yes/Noを聞かれたらy

2.MariaDB起動

tech@DIGIROCK-PC:~$ sudo service mysql start

3.MariaDB初期設定

tech@DIGIROCK-PC:~$ sudo mysql_secure_installation

※MariaDBのrootパスワード設定等、初期設定を行う。以下、表示される説明を読み、設定項目を入力していく。

Enter current password for root (enter for none):

※最初はDBのrootユーザーのパスワードは無いので何も入力せずにEnterキー

You already have your root account protected, so you can safely answer 'n'.

Switch to unix_socket authentication [Y/n] n

※MariaDB独自に管理者パスワードを設定した方がセキュリティが高くなるのでn

Change the root password? [Y/n] y

※DBのrootユーザーのパスワードをセットしたいからy

New password:
Re-enter new password:

※DBのrootユーザーのパスワードを入力

Remove anonymous users? [Y/n] y

※匿名ユーザーでログインさせたくないからy

Disallow root login remotely? [Y/n] y

※リモートからrootユーザーで繋がせたくないからy

Remove test database and access to it? [Y/n] y

※testデータベースは不要だからy

Reload privilege tables now? [Y/n] y

※いま設定した権限をリロードしてほしいからy

All done!  If you've completed all of the above steps, your MariaDB
installation should now be secure.

Thanks for using MariaDB!
tech@DIGIROCK-PC:~$

※上記が表示されたら初期設定完了!


以上でMariaDBの初期設定が終わりました。
少し大変ですね。
しかし、安全に環境を構築するには避けられない手順です。

データベースとデータベースユーザー作成

次に、MariaDB上にWordPressから使用するデータベースとデータベースユーザーを作成します。

1.MariaDB一般ユーザー用データベース作成(データベース名:techの場合)

tech@DIGIROCK-PC:~$ sudo mysql -u root -p
Enter password:

※MariaDB インストール後に設定した MariaDB の root ユーザーのパスワードを入力

MariaDB [(none)]> CREATE DATABASE tech CHARACTER SET utf8mb4;
MariaDB [(none)]> SHOW DATABASES;

※データベース「tech」があれば成功

MariaDB [(none)]> quit

※MariaDBから抜ける

2.MariaqDB一般ユーザー作成(ユーザー名:tech パスワード:digirockの場合)

tech@DIGIROCK-PC:~$ sudo mysql -u root -p
Enter password:

※MariaDBインストール後に設定したMariaDBのrootユーザーのパスワードを入力

MariaDB [(none)]> CREATE USER tech@localhost;
MariaDB [(none)]> GRANT ALL PRIVILEGES ON tech.* TO tech@localhost IDENTIFIED BY 'digirock';
MariaDB [(none)]> FLUSH PRIVILEGES;
MariaDB [(none)]> SELECT user, host, password FROM mysql.user;

※ユーザー名「tech」があれば成功

MariaDB [(none)]> quit

※MariaDBから抜ける

以上です。
MariaDB(あるいはMySQL)とSQL文について、ある程度の知識が無いとわけが分からないかもしれませんが、慣れればそれほど苦労しない内容かと思います。

サーバーの自動起動・停止設定

さて、前回Windows上でLinux仮想環境を構築【WSL2でお気楽Web開発】

  • ApacheとPHP-FPMはUbuntuターミナルを閉じただけでは自動では終了しない
  • ApacheとPHP-FPMはUbuntuターミナルを立ち上げただけでは自動では起動しない

ことを説明しました。MariaDBも同様となります。

停止スクリプトと起動スクリプト設定

ubuntuターミナルを閉じる前

tech@DIGIROCK-PC:~$ sudo service php8.1-fpm stop
tech@DIGIROCK-PC:~$ sudo service apache2 stop
tech@DIGIROCK-PC:~$ sudo service mysql stop

Ubuntuターミナルに入った直後

tech@DIGIROCK-PC:~$ sudo service php8.1-fpm start
tech@DIGIROCK-PC:~$ sudo service apache2 start
tech@DIGIROCK-PC:~$ sudo service mysql start

と手動で実行する必要があります。

自動化する手順は、やはり「.bashrc」と「.bash_logout」ファイルに手を加えます。

エクスプローラーで「\wsl.localhost\Ubuntu\home\tech」を参照、「.bash_logout」をテキストエディターにて開いて下記を一行目以下に挿入。

# PHP Apace2 停止
/usr/bin/sudo /usr/sbin/service php8.1-fpm stop
/usr/bin/sudo /usr/sbin/service apache2 stop
/usr/bin/sudo /usr/sbin/service mysql stop

※Ubuntuターミナルを抜けるときは、必ず「exit」コマンドで抜ける必要があります。Ubuntu ターミナルウィンドウの「X」で閉じたときは自動停止されません。

エクスプローラーで「\wsl.localhost\Ubuntu\home\tech」を参照、「.bashrc」をテキストエディターにて開いて下記を最後尾に追加。

# PHP Apace2 起動
/usr/bin/sudo /usr/sbin/service php8.1-fpm start
/usr/bin/sudo /usr/sbin/service apache2 start
/usr/bin/sudo /usr/sbin/service mysql start

さて、だいぶ環境も整ってきました。

ここまで来ればいよいよWordPressをインストール可能な状態になっています。

しかし、使われる方も多いかと思いますので、PhpMyAdminのインストール方法を先に説明いたします。必要無い方は飛ばしていただいも大丈夫です。

Right Caption
注)PhpMyAdminには、IPアドレスさえ分かれば同一ネットワークからアクセス可能になります。Ubuntuを立ち上げている間は公共のWiFi等、不特定多数が使うネットワークに接続するのを避けるか、どうしても必要な場合はデータベースへの接続パスワードを十分に複雑なものを設定することをお勧めします。

PhpMyAdminインストール

1.PhpMyAdminをインストールする

tech@DIGIROCK-PC:~$ sudo apt install phpmyadmin

2.インストール中に実行しているWebサーバーを聞かれるので、「apache」を選択(Spaceキー)

3.タブキーで「了解」ボタンにフォーカスを移し、Enterキーで選択完了

4.dbconfig-comonコマンドでMariaDBのインストールなどを行うか聞かれるが、既に済ませてあるので「いいえ」を選択(右矢印キー)

5.Enterキーで選択完了

6.インストール完了後、Webブラウザでhttp://localhost/phpmyadmin/にアクセスして、PhpMyAdminが表示されればインストール成功

※先ほど作成したデータベース一般ユーザー(tech)でログインできるか確認!

お疲れさまです。

やっとWordPressをインストール出来る環境が整いました。

WordPressインストール

WordPressインストール手順を説明いたします。

1.以下のURLでインストールパッケージのURL(https://ja.wordpress.org/latest-ja.tar.gz)を確認
https://ja.wordpress.org/download/

2.WordPressインストールパッケージのダウンロード、展開

tech@DIGIROCK-PC:~$ cd public_html/
tech@DIGIROCK-PC:~/public_html$ wget --no-check-certificate https://ja.wordpress.org/latest-ja.tar.gz
tech@DIGIROCK-PC:~/public_html$ ls -l
合計 15488
-rw-r--r-- 1 tech tech      101  9月 30 03:23 index.html
-rw-r--r-- 1 tech tech 15832111  9月 11 01:00 latest-ja.tar.gz
-rw-r--r-- 1 tech tech       23  9月 30 03:42 phpinfo.php
tech@DIGIROCK-PC:~/public_html$ tar zxvf latest-ja.tar.gz
tech@DIGIROCK-PC:~/public_html$ ls -l
合計 15488
-rw-r--r-- 1 tech tech      101  9月 30 03:23 index.html
-rw-r--r-- 1 tech tech 15832111  9月 11 01:00 latest-ja.tar.gz
-rw-r--r-- 1 tech tech       23  9月 30 03:42 phpinfo.php
drwxr-xr-x 1 tech tech      512  9月 11 01:00 wordpress

3.wordpressディレクトリをapacheから書き込み可に

tech@DIGIROCK-PC:~$ ls -l public_html/
合計 15488
-rw-r--r-- 1 tech tech      101  9月 30 03:23 index.html
-rw-r--r-- 1 tech tech 15832111  9月 11 01:00 latest-ja.tar.gz
-rw-r--r-- 1 tech tech       23  9月 30 03:42 phpinfo.php
drwxr-xr-x 1 tech tech      512  9月 11 01:00 wordpress
tech@DIGIROCK-PC:~$ chmod 707 public_html/wordpress
tech@DIGIROCK-PC:~$ ls -l public_html/
合計 15488
-rw-r--r-- 1 tech tech      101  9月 30 03:23 index.html
-rw-r--r-- 1 tech tech 15832111  9月 11 01:00 latest-ja.tar.gz
-rw-r--r-- 1 tech tech       23  9月 30 03:42 phpinfo.php
drwx---rwx 1 tech tech      512 10月  2 18:26 wordpress

※「http://localhost/~tech/wordpress/」にアクセスしてWordPressインストール画面が表示されれば成功

4.WordPressインストールを進め、完了させる

5.エクスプローラーで「\wsl.localhost\Ubuntu\home\tech\public_html」にアクセス。「wordpress」ディレクトリができていることを確認

6.不要な「latest-ja.tar.gz」を、エクスプローラーから削除する

長かったですが、WordPressのインストールが済んでテーマ、プラグイン開発などを好きな開発環境で開発できるようになりました。
下記の例はWidnows版Visual Studio Codeで「Hello_Dolly」プラグインを開いてみた様子です。

Ubuntuアプリを再インストール出来ない場合の対処法

以下は、Ubuntuアプリを再インストールした際に「error code: wsl/service/createinstance/mountvhd/hcs/error_file_not_found」と表示されてインストール出来ない場合の対処法です。

1.Ubutnuの起動エラーが表示されている場合は、何かキーを押して、終了します。

2.Windows PowerShellを起動します。

3.PowerShellで「wsl-l」を使って登録されているディストリビューションを取得します。

PS C:\Users\user> wsl -l
Linux 用 Windows サブシステム ディストリビューション:
Ubuntu (既定)

4.Ubuntuの登録を解除します。

PS C:\Users\user> wsl --unregister Ubuntu
登録解除。
この操作を正しく終了しました。

5.Ubuntuを起動して初期化処理を行います。

Right Caption
注)UbuntuアプリをWindowsよりアンインストールすると、全てのデータは破棄されてしまいますので、アンインストールは必要に応じてバックアップを取ってから行う必要があります。

まとめ

今回の記事では、Windows上のWSL2環境でMariaDB、PhpMyAdmin、WordPressをインストールし、開発環境を整える手順を詳しく説明しました。

これにより、FTPなどを使わずにWindowsの開発ツールを直接利用して効率的にWeb開発ができるようになります。

また、手元で開発が済んだテーマやプラグインをインターネット上での公開するなら、レンタルサーバーを使うとさらに便利です。

特におすすめなのがコアサーバーです。トラフィックの増加やセキュリティのリスクにも対応しているので安心です。コストパフォーマンスの高いコアサーバーをぜひご利用ください。

この記事が皆様のWeb開発の一助となれば幸いです。

▽キャンペーン開催中!
コアサーバーでは、V2プランとドメインの同時申し込みで
ドメインが実質0円(年間最大3,882円お得)になるサーバーセット割特典、
V2プランが初期費用無料15%OFF(月額390円→331円)ブラックフライデーセール
を展開中です。
是非、お得なこの機会にご利用ください!
最新のキャンペーンは
こちらから

超高速化を実現するレンタルサーバー CORESERVER


この記事を監修した人
左川善章
左川 善章

GMOデジロック インフラエンジニア
ボケもツッコミも下手な関西人。Windows98で動作するWebサーバーを使用した自宅サーバー構築から初めて、紆余曲折を経て今に至る。
▽登壇実績
https://ct-study.connpass.com/event/55305/
https://gmohoscon.connpass.com/event/102401/

Posted by admin-dev


おすすめ関連記事

service

Value Domain
ドメイン取得&レンタルサーバーなら
Value Domain
ドメイン登録実績600万件を誇るドメイン取得・管理サービスと、高速・高機能・高品質なレンタルサーバーや、SSL証明書などを提供するドメイン・ホスティング総合サービスです。
目次へ目次へ