Win10にxamppを使ったwordpressのローカル検証環境をつくる

# XAMPPとは

LAMP (Linux + Apache + MySQL or MariaDB + PHP) 環境を作れない非Linux環境で仮想LAMP環境を作れるようにするパッケージで、cross platform + Apache + MySQL + PHP + Pearlの頭文字をとってXAMPPだそうです。Windows、Mac、Solaris、Linux版が利用可能です。

１つインストールするだけで一式整うのでWindows環境などでPHPやwordpressのローカル開発環境をほしい場合に便利です。僕はWin10でwordpressを試す環境として利用しています。

# 1. XAMPPのインストール

XAMPP公式ページからダウンロードします。
https://www.apachefriends.org/jp/index.html
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/1aedd961-f8b0-8a11-dcca-abb44bcd40ae.png" width=70%>
落ちてきたインストーラーをダブルクリックしてインストールします。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/f5841b79-420c-7f77-32d7-ed796c802b2b.png" width=50%>
インストールが完了したら起動して、ApacheとMySQLの横にあるStartボタンを押してApacheとMySQLを起動します。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/6dab9599-a8c3-98ad-01b2-938d482dc029.png" width=50%>
これだけでlocalhostにApacheが待機しますので、http://localhost にアクセスしてXAMPPの待機画面を確認してみましょう。上手く動いていれば以下のように表示される筈です。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/be431754-751e-3f8b-ce21-28710d1a5f34.png" width=50%>


# 2. XAMPPのセキュリティ設定

### MySQLのパスワードを設定する

XAMPPのコンソールのShellをクリックしてXAMPP環境のターミナルを開きます
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/b7bf5726-cafa-ab81-ed5a-de306b90b727.png" width=50%>

XAMPPターミナルでMySQLのディレクトリに移動してmysqlにrootログインしてパスワードを設定します。以下ではパスワードに「hoge」を設定していますが実際には長くて推測が難しいパスワードを設定するようにしてください。

```terminal:XAMPPターミナル
cd mysql\bin
mysql -u root
set password=password('hoge');
```
「Query OK」と表示されたら正常に変更できています。

次回以降、変更されたパスワードでログインするには以下のようにします。hogeのところを皆さんの設定したパスワードに変更すればログインできる筈です。パスワードを間違えると二度とログイン出来なくなってしまうので、パスワードを変更したターミナルを開いたままで、もう１つXAMPPターミナルを開いてログインできるか確認するようにしてください。

```terminal:XAMPPターミナル
mysql -u root --password=hoge
```
問題なければquitでログアウトして、exitでターミナルを閉じます。

### phpMyAdminのログイン設定を変更する

XAMPP上のPHPはデフォルトでは設定ファイルに書かれたパスワードでMySQLにログインするようになっていますが、パスワードが変更されたのでこのままだとログイン出来ません。

試しにXAMPPコンソールのMySQL AdminボタンをクリックしてphpMyAdminを開いてみるとエラー表示が出ます。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/734747a1-9309-97be-e4a1-53c6c38a1a71.png" width=50%>
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/b4bcc3dd-361e-eda4-095f-4a360f5723f4.png" width=50%>

phpMyAdminの設定ファイルは /xampp/phpMyAdmin/config.inc.php です。ログイン設定に該当する部分を以下のように書き換えます。

```php:/xampp/phpMyAdmin/config.inc.php変更前
$cfg['Servers'][$i]['auth_type'] = 'config';
$cfg['Servers'][$i]['user'] = 'root';
$cfg['Servers'][$i]['password'] = '';
```

```php:/xampp/phpMyAdmin/config.inc.php変更後
$cfg['Servers'][$i]['auth_type'] = 'cookie';
$cfg['Servers'][$i]['user'] = '';
$cfg['Servers'][$i]['password'] = '';
$cfg['blowfish_secret'] = 'fugafugafugafugafugafugafugafuga'
```
↑ fugafugaのところは推測困難な任意の文字列32文字以上に変更してください

変更前はrootにパスワードなしでログインするように決め打ちで書かれていますが、変更後はログインしたcookieが残っていればパスワードなしでログインし、cookieがない時は自分でユーザー名とパスワードを入力するように変更されます。なお、blowfish_secretはcookie偽装対策に使うパスワードです。

再度phpMyAdminにアクセスするとユーザー名とパスワードを要求されます
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/8b4f8d63-8f31-b5cc-c317-67aa8a5bee42.png" width=50% boarder="2">
ユーザー名に「root」を入力して先程設定したパスワードを入力するとphpMyAdminにログインできます
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/a3c6f416-28b8-e2a4-e659-713ab3fa36d7.png" width=50%>

# 3. WordPressで使うデータベースを作る

phpMyAdminの「データベース」タブをクリックして、作成ボタンの左側にあるテキストボックスにデータベース名を入力して「作成」ボタンをクリックしてデータベースを作成します。種類は「utf8mb4_general_ci」のまま変更なしで大丈夫です。下の画像では「wp-01」名でデータベースを作成しています。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/bc526631-110d-7c9e-5a3e-ffb087135c92.png" width=50%>


# 4. WordPressをXAMPP環境にインストールする

以下のサイトからWordPress一式をまとめてダウンロードします

WordPress公式
https://ja.wordpress.org/download/
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/9fa824e8-a8a0-0600-6dd6-246588eb3d8c.png" width=50%>

落ちてきたzipファイルを解凍して、中のwordpressフォルダをXAMPPをインストールしたフォルダのドキュメントルートに置きます。XAMPPのドキュメントルートはWindows10のデフォルト設定では c:/xampp/htdocs/ ですのでc:/xampp/htdocs/wordpress/となるように置いてやればOKです。

フォルダを配置できたらXAMPPのApacheとMySQLをStartした状態でブラウザから http://localhost/wordpress/ にアクセスして以下のような画面になればインストール完了です。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/000de690-9179-c2fb-3133-adeeb3772a1d.png" width=50%>

入力欄が表示されたら2~3で設定したデータベース名やパスワードを入力します

データベース名: 3で作ったデータベース名
ユーザー名: root
パスワード: 2で設定したMySQLのパスワード
データベースのホスト名: localhost
テーブル接頭辞: wp_
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/e67e21fd-f127-a1f8-c692-60f7734ce686.png" width=50%>
できました
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/277233/f6ccfc4c-3826-466d-7c3a-c9c859541e02.png" width=50%>

以降は通常のWordPressと同様です
エンジョイ！