WordPressの環境開発にはどのようなツールを使用していますか？
「WordPressを使いたいけどどんなツールを使えば良いのかわからない」という方もいるのではないでしょうか？
今回は、WordPressの環境開発におすすめのツールを紹介します。
WordPressの開発環境
WordPressでWEBサイトを制作するためには開発できる環境を整えることが必要です。
これはWordPressに限った話ではありません。
プログラミングでは何かを開発するために必要な環境をつくることはよくあることです。
「開発環境」と聞くと「難しそう…」と思われる方もいると思います。
確かに開発環境が難しいプログラミング言語もありますが、WordPressの場合は簡単に開発環境を整えることが可能です。
WordPressの開発環境を構築するツールはこのようなモノがあります。
・MAMP、XAMPP
・Local by Flywheel
・Instant
・Bittnami
結論から言うと、「MAMP・XAMPP」もしくは「Local by Flywheel」がおすすめです。
今回はこの2つのツールについて紹介します。
各ツールの機能やメリット・デメリットも含めて解説します。
MAMP・XAMPP
WordPressの開発環境をといえば、「MAMP・XAMPP」といわれるほど人気のあるツールです。
WordPressの開発環境を構築するおすすめツールの1になります。
見た目もシンプルで使いやすいのが特徴の「MAMP・XAMPP」です。
「MAMP・XAMPP」って名前が2つあるのが気になりますよね。
これは使用しているOSによって使用するツールの名称が違うからです。
Windowsの方は「XAMPP」を使用して、Macの方は「MAMP」を使用します。
名称が違うだけで機能性や使い方はほとんど同じです。
MAMPをインストールするだけで「PHP」・「MySQL」・「Apache」を使用することができます。
なので、個別に「PHP」・「MySQL」・「Apache」をインストールする必要はありません。
また、コマンドを入力する必要もなく初心者も簡単に扱うことができます。
「MAMP・XAMPP」ともに無料で使用することが可能です。
「MAMP・XAMPP」のインストールはこちらからできます。
MAMPのインストールURL
https://www.mamp.info/en/
XAMPPのインストールURL
https://www.apachefriends.org/jp/download.html
「MAMP・XAMPP」をインストールすれば、WordPressに必要なモノは全てそろいます。
また、機能性も充実しています。
ウェブサーバーはApacheの他にNiginxも使用することが可能です。
また、プログラミング言語もPHPの他にPysthon・Perlも使用できます。
MAMPは無料で使用することが可能ですが、有料で使用できる「MAMP PRO」というバージョンもあります。
MAMP PROではカスタマイズ性が高くなっており、複数のサイトを簡単に管理することが可能です。
MAMP PROにはこのような機能が搭載されています。
Mobile Testing
名前の通りスマホ・タブレットなどのモバイルでローカルサーバーの内容が確認できる機能です。
iPhoneに「MAMPビュアー」をインストールすることで確認できます。
スマホ・タブレットで表示確認・動作確認するときにとても便利です。
Nginxのサポート
現在は、WEBサーバーの割合はApacheの方が高いですが、次に大きな割合を占めているのがNginxです。
本番環境でNginxを使用する場合、ローカル環境でもNginxを使用することができます。
このように本番環境とローカル環境を同じにしておくことでエラーやバグを修正しやすくなります。
通常の「MAMP」版でもNginxのWEBサーバーを使用することが可能ですが、「MAMP PRO」の場合はフルサポートで使用できます。
LANアクセス
「Android・iPhoneの端末から開発中のサイトにアクセスしたい」、「Android・iPhoneからローカルサーバーにアクセスしたい」というときに便利なのがLANアクセスです。
この機能を利用することで同じLAN内で他の端末から簡単にアクセスできます。
このように「MAMP PRO」は「MAMP」よりも機能性が高く、カスタマイズ性も高いのが特徴です。
「MAMP PRO」の料金はこのようになっています。
MAMP PRO4：69ドル
MAMP PRO5：69ドル
MAMP PRO5 Update：34.5ドル
MAMP Cloude：9.99ドル
今回は、MAMPのインストール方法を紹介します。
まずは、公式サイトに移動しましょう。
MAMP公式サイトURL：https://www.mamp.info/en/
公式サイトにアクセスしたら使用するOSを選択して、ダウンロードボタンをクリックします。
これはMAMP自体をインストールしているのではなく、「インストーラ」をダウンロードします。
インストーラのダウンロードには10分〜20分程度時間がかかります。
MAMPは最低限このようなシステムで使用するのがおすすめです。
・Mac：OS X 10(Yosemite)以上で64ビットプロセッサ
・Windows：Windows 10, Windows 8.1もしくはWindows 7、 メモリ2GB以上
・ハードディスク空き容量2GB以上
あまりに古いOSバージョンや空き容量が少なすぎると正常に動作しない可能性があります。
その点にも注意しましょう。
インストールが完了したら、インストーラを開いてインストール設定をおこないましょう。
インストーラを開くとこのような画面が開くので、「続ける」ボタンをクリックします。
次の画面では「大切な情報」が表示されます。
ここは英語で表示されていますが、ようやくするとこのような文章になります。
「このインストーラはMAMPとMAMP PROをアプリケーションフォルダにインストールします。MAMPフォルダを移動したり、名前を変更したりしないでください。」
このような内容の文章が記載されていますが、基本的には「続ける」ボタンをクリックすればOKです。
次の画面では、「使用許諾契約」が表示されます。
ここでも文章が英語 で表示されます。(ドイツ語で表示される場合もあります)
問題がなければ「同意する」をクリックした後に「続ける」ボタンをクリックしましょう。
次にインストール画面が表示されます。
インストール画面では「Macintosho HD」が選択されていることを確認しましょう。
確認できたら、「インストール」ボタンをクリックします。
注意してほしいのは場合によっては、この画面が自動的にスキップされる可能性もあります。
なぜなら、MacのOSではインストール先に選択できるのは起動ディスクのみだからです。
Windowsの場合は任意の場所をインストール先に選択できます。
また、Windowsの場合「インストール」を選択してからもうワンステップあります。
それは、スタートメニューに「MAMP」ショートカットをつくることを確認するステップです。
ショートカットはスタートメニューだけでなく、デスクトップ上にも作成するかを問われます。
次は、インストールの確認画面です。
Macのユーザーアカウント名とパスワードを入力して、「インストール」をクリックするとインストールが始まります。
Windowsではこのステップはありません。
これでMAMPのインストールは完了です。
次は、インストールしたMAMPを起動させて実際に設定を見ていきましょう。
Macの方はアプリケーションの中に保存されているMAMPを起動させてください。
MAMPを起動させるとこのような画面が表示されます。
一番左に表示されている歯車アイコン(Preferences)は、MAMPの設定をおこなう部分です。
真ん中に表示されている地球儀のようなアイコンは、ローカルサーバーのスタートページが開かれます。
一番右に表示されている電源のアイコンは、Apache/NginxやMySQLサーバーのON/OFFの切り替えをおこないます。
ここまで確認できたら、起動画面から「Preferences」をクリックして初期設定をおこないましょう。
基本的にはデフォルトのままでOKですが、現状の設定を確認する意味も込めて必ず1度は確認するようにしてください。
それでは、実際に設定画面を見ていきましょう。
設定画面はこのようなタブメニューになっています。
・スタート/ストップ
・ポート
・PHP
・Webサーバー
スタート/ストップタブ
おそらくデフォルトの設定では画像のような設定になっていると思います。
基本的にこのままの設定でOKですが、1つ1つ項目を見ていきましょう。
「サーバーを始動」は、MAMPの起動時にウェブサーバーとMySQLサーバーを自動的に起動します。
便利な機能なので必ずチェックしましょう。
「MAMP PROを確認」は、MAMPの起動時に MAMPかMAMP PROかを選択する画面を表示します。
MAMPだけを使用する場合は、この画面は不要なのでチェックを外したままにしておきましょう。
「オープンWebStartのページ」は、MAMPの起動時にWebStartページを自動的にブラウザで開きます。
これはどちらでも構いませんが、チェックを入れておいた方が便利だと思います。
「MAMPの終了時にサーバーを停止」は、MAMPを終了するときにウェブサーバーとMySQLサーバを自動的に停止します。
この項目は必ずチェックを入れておきましょう。
「私のお気に入りのリンク」は、ここに入力したURLはWebStartページのトップメニューに「私のお気に入りのリンク」として表示されます。
基本的には空欄のままでOKです。
ポートタブ
「Apacheポート」、「Nginxポート」、「MySQLポート」はこのように設定してください。
Apacheポート： 8888
Nginxポート：7888
MySQLポート：8889
このように設定すればOKです。基本的にはデフォルトのままで大丈夫です。
Windowsをではデフォルトでポート設定が以下のように80、80、3306になっていると思います。
Apacheポート： 80
Nginxポート：80
MySQLポート：3306
そのような場合は、上記でも説明したように8888、7888、8889に設定してください。
Apacheポート： 8888
Nginxポート：7888
MySQLポート：8889
また、ファイヤーウォールやセキュリティソフトの設定によっては、これらのポートへのアクセスがブロックされている場合があります。
そのときは、これらの設定を見直すようにしてください。
「MAMPポートをデフォルトに設定」は、Apache、Ngnix、MySQLのポートを初期値に戻すことができます。
PHPタブ
標準バージョンでは、PHPのバージョンを指定することが可能です。
使用したいPHPバージョンを選択してください。
「キャッシュ」は、PHPのコードを高速で実行することができますが、ソースコードを変更したときに変更箇所が反映されない場合があるので注意が必要です。
変更箇所が反映されない事態を防ぐためにも「オフ」のままにしておきましょう。
Webサーバータブ
Webサーバーは、ApacheかNiginxを選択することが可能です。
日本のレンタルサーバーの多くはウェブサーバーにApacheを採用しています。
なので、基本的にApacheを選択するのがベターです。
WebサーバーをNiginxを選択している場合も変更して対応することが可能です。
「ドキュメントルート」は、HTML・PHPファイルや画像を保存場所になります。
MAMPの上x部サーバーを立ち上げたあとに表示される「http://localhost:8888/」アクセスしたときに表示されるドキュメントルートです。
初期設定では「MAMP」内の「htdocs」フォルダに設定されています。
この設定を変更すれば、保存先を任意のフォルダに変更することも可能です。
基本的には初期設定のままでOKです。
ここまでで、MAMPの初期設定は完了です。
初期設定で完了したら、サーバーを起動させましょう。
一番右側に表示されている「サーバを起動」のボタンをクリックすると、サーバーが起動します。
データベースを作成する
MAMPのサーバーを起動している状態で「オープンWebStart」をクリックすると、WebStartページにアクセスします。
データベースの作成は「phpMyAdmin」をクリックして、移行先のページでデータベースを作成できます。
「データベース」のタブをクリックして、新規作成するデータベース名を入力して「作成」ボタンをクリックすると新しいデータベースが作成されます。
あとはWordPressの公式サイトからWordPressをダウンロードして、「htdocs」フォルダの中に入れたら準備完了です。
WordPressの公式サイトURL：https://ja.wordpress.org/
ここまでがMAMP・XAMPでWordPressを開発するための下準備になります。
Local by Flywheel
次に紹介するのが「Local by Flywheel」です。
MAMPよりも簡単に使えて、動作が早いことで人気を集めています。
Local by Flywheelのインストールはコチラからできます。
https://local.getflywheel.com/
Local by Flywheelは、仮想環境を構築するために「Docker」と「VirtualBox」をインストールします。
このような環境を構築しているので、動作がサクサク動きます。
また、ローカル環境を構築するまでの手順が簡単なのもメリットです。
実際にLocal by Flywheelを開くとこのような画面になります。
Local by Flywheelの特徴の1つとして、いま開いているウィンドウだけで複数のローカル開発プロジェクトを管理することが可能です。
左下に表示されている「＋」マークをクリックすると、プロジェクトを追加できます。
MAMP・XAMPの場合、新しいWordPressサイトを作成するときは、WordPressの公式サイトからダウンロードしてファイルを入れる必要はありません。
なので、新しいプロジェクトを追加したいときは「＋」マークをクリックしてください。
「＋」マークをクリックすると、このような画面に推移します。
この画面では、サイトの名前を入力して決定します。
また、「ADVANCED OPTIONS」をクリックすると、より細かく設定することが可能です。
「Local site domain」では、ローカルでのドメイン名を設定できます。
「Local site path」では、プロジェクトのローカルでの保存先を選択できます。
「Create site from Blueprint」では、開発環境のテンプレートのようなモノです。
事前に「Blueprint」を保存しておかないと使用することができません。
なので、初めて「Local by Flywheel」を使用する場合はこの機能を特に設定しなくてOKです。
この部分は上級者の設定なので、わからなければ特に触る必要はありません。
サイト名を入力して「CONTINUE」をクリックするとこのような画面に移動します。
この画面では作成する環境をある程度自由に設定することができます。
初期設定では「Preferred」(推奨設定)になっています。
推奨設定では、「PHPのバージョンが7.2.9」、「Web Serverがnginx + Varnish」、「MySQLのバージョンが5.7」になっています。(2018年12月現在)
特にこだわりのない場合は、このままの設定(Preferred)でOKです。
「Custom」を選択すると開発環境を自由に設定できます。
以下の3つを自由に設定することが可能です。
・PHPのバージョン
・Web ServerをNgnixとApacheから選べる
・MySQLのバージョン
「推奨設定(Preferred)があるのにCustomを選ぶ理由は何？」って思いますよね。
それは、本番環境と近づけることで、エラーに対応しやすくなることです。
例えば、PHPの7.2.0でエラーが出た場合でも同じPHPのバージョンで環境を作成して対応することができます。
PHPのバージョンはMAMPよりも豊富に用意されているので、幅広いバージョンに対応することが可能です。
また、下の画像のように各項目のバージョンなどは環境を作成した後でも変更できます。
作成後もバージョンを変更できるので、エラーに対して柔軟に対応することが可能です。
また、「テスト環境を構築したい」というときもボタン1つで作成できます。
テスト環境を構築するのに便利なのが、Local by Flywheelの「Clone」機能です。
クローン環境の作成は、作成したいサイトを選択して右クリックすると「Clone」のメニュー項目が表示されます。
ここで「Clone」を選択するとクローンが作成されます。
これでLocal by Flywheelでの環境開発は完了です。
MAMPよりも簡単に素早く環境開発を構築できるのがメリットになります。
また、PHPのバージョンも幅広く養鯉されているのもメリットです。
Local by Flywheelのデメリットは、以下の2つになります。
・Local by Flywheelをインストールするのに時間がかかる
・情報量がMAMPと比べて少ない
WEBサイトの表示
プロジェクトが作成できたら、実際にWEBサイトを見てみましょう。
右上に表示されている「VIEW SITE」をクリックすると作成したWEBサイトを見ることができます。
また、「VIEW SITE」のとなりにある「ADMIN」をクリックすると、管理画面にアクセスできます。
「Local by Flywheel」で作成したWEBサイトの言語は英語になっています。
設定言語の変更は、「Setting」→「General」→「Site Language」から変更することが可能です。
「Local by Flywheel」を使用すればローカル環境でもSSL化することができます。
SSL化は、タブメニューに表示されている「SSL」を選択します。
「Certificate」の欄に表示されている「TRUSTED」をクリックすれば、SSL化することが可能です。
また、サイト名の下に表示されている矢印のアイコンをクリックするとデータを格納しているフォルダが表示されます。
ファイルの構成やサーバーにアップロードするときに便利です。
格納しているファイルを表示させたいときはココをクリックすると覚えておきましょう。
まとめ
いかがでしたか？
今回は、WordPressの環境開発を作成するツールである「MAMP」と「Local by Flywheel」について紹介しました。
「MAMP」は、昔から人気のあるツールのため情報量が多いのがメリットです。
その反面、「Local by Flywheel」と比較すると作業が多くなるのがデメリットになります。
「Local by Flywheel」は、「MAMP」と比べて歴史が浅いので情報量が少ないのがデメリットです。
しかし、「MAMP」よりも手軽に使うことができ、機能性も高いのがメリット。
WordPressを使うときは、この2つのツールのどちらかを使ってみてはいかがでしょうか？