ROCHAS

Vagrantを使ってローカルでWordPressを立ち上げる

とにかく私がやりたかったことは、Wordpressをローカル環境に構築して思う存分デザインがしたい!テーマのバージョン管理がしたい!ということ。
そこで @machidaさんに相談してみると・・・「Vagrant にしましょう。」 え?!なんだか難しそう。。プログラマ界隈では当然の技術なんだろうな〜。MAMPでいいですかなんて言えないオーラ。
でもWordpressのローカル環境くらいならデザイナにだってできるはず。がんばってやってみます。

手順

  1. Vagrant のインストール
  2. VirtualBox のインストール
  3. boxファイルのダウンロード
  4. vm作成(caseproof-lampの例)
  5. Vagrant のインストール
  6. WordpressをGitでバージョン管理
  7. ローカルインターン募集します

Vagrantとは、コマンドラインだけで簡単に仮想マシンに開発環境を構築できる、Ruby製のソフトウェアです。
DebianやCentOS の vmをローカルに構築して、chef-solo や knife-solo などと連携し、アプリケーションの環境構築から立ち上げまでを一気に自動化してしまうなんてこともできてしまいます!
今回はこのVagrantを使ってWordpressのローカル環境をたちあげるという試みです。Vagrantを使うためにはまず仮想マシンとしてVirtualBoxをインストールします。その中にBoxファイルを準備して、そこにWordpressを突っ込みます。あとはwp-configの設定を書いてあげれば完成です。
さらにGit管理してあげると、テーマのバックナンバーがとっておけて便利です。

1. Vagrant のインストール

公式サイトより、OSX用の最新版をダウンロードする。
Vagrant

2. VirtualBox のインストール

公式サイトより、Download Old Builds 4_1あたり?のオールドバージョンをダウンロードする。 最新版はエラーがでてしまうので使えません!ここハマリポイントですので注意。
Oracle VM VirtualBox

3. boxファイルのダウンロード

Vagrantは、仮想マシンとして使うboxファイルが必要です。実際はこの箱の中にWordoress環境をつくっていくことになります。
Boxファイルは Vagrantbox.es にたくさん用意されているのですが、どれをつかったらいいのかわかないですねw という方のために 今回はこちらのページには掲載されていない、Wordpress向けのBoxファイルを2つご紹介します。

ちなみに断固Debian!な方は @komagataさんknife-solo + vagrant - komagataをご参考になさってください。怖話環境もDebianで構築しています。 またBoxファイルは自分で作成することもでき、@komagataさん自作のBoxもあります!超軽量!すごいですね!

4. caseproof-lampのvm作成

$ vagrant box add {title} {url} 

このようにBoxの名前とURLをコマンドで打ってインストールします。 以下はBoxファイルをcaseproof-lampを使った例で解説していきます。(他のBoxファイルをお使いの場合はcaseproof-lampの部分を書き換えてください。)

$ vagrant box add caseproof-lamp https://s3.amazonaws.com/caseproof/caseproof-lamp.box

インストールが完了したらローカルの好きな場所にVagrantfile用のディレクトリを作成し(ファイル名は任意。)Vagrantfileを作成します。

$ mkdir caseproof-lamp
$ cd caseproof-lamp 
$ vagrant init caseproof-lamp

いよいよVagrantを起動。デフォルトのアドレスはインストール時に http://localhost:8080/とコマンドラインが教えてくれます。(IPアドレスを固定したい場合など、諸々設定が必要であればVagrantfileに書きます。)

$ vagrant up 
$ open http://localhost:8080

以下のコマンドでVagrant がちゃんと起動したかを確認。runningとなってればOK。

$ vagrant status

Vagrant をシャットダウンする時は

$ vagrant halt

ここまできたらあとはWordpress側の設定だけです。

5. wp-config.php にDBの設定を記述

Wordpressファイルをboxファイルに格納して、wp-config.php にDBの設定を記述します。

// ** wp-config.php ** //
/** WordPress のためのデータベース名 */
define('DB_NAME', 'vagrant');
/** MySQL データベースのユーザー名 */
define('DB_USER', 'root');
/** MySQL データベースのパスワード */
define('DB_PASSWORD', 'vagrant');
/** MySQL のホスト名 */
define('DB_HOST', 'localhost');
/** データベースのテーブルを作成する際のデータベースのキャラクターセット */
define('DB_CHARSET', 'utf8');
/** データベースの照合順序 (ほとんどの場合変更する必要はありません) */
define('DB_COLLATE', '');

これでhttp://localhost:8080/ローカル環境でWordpressを立ち上げることができました!

6. WordpressをGitでバージョン管理

これだけでも便利なのですが、私はGitでテーマのバージョン管理をしています。 wp-content、またはThemeディレクトリで $ git init
wp-contentを管理するときは .gitignore に以下を書いて追跡を外してあげます。

.gitignore
wp-config.php
wp-content/uploads/*
!wp-content/uploads/.htaccess

ローカル環境×Git管理でWordpressが使えるようになってからというもの、作ったり、壊したり、思う存分デザインすることができるようになりとっても快適です。ぜひ試してみてくださいね。

7. ローカルインターン募集します

ここで重要なお知らせ!ただいまFJORDではローカルインターンを募集しています。 プログラマさんばかりではありません。普通のWebサイトだけでなくRailsアプリにデザインがしたい!Gitを駆使してプロジェクトに参加したい!企業したい!とにかくデザインを愛する❤ そんなデザイナーさん、フルスタック?デザイナーになれるチャンスです!! 詳しくはこちらへ・・・

超豪華商品が当たる!ローカルインターン募集

あれ?私超豪華商品もらったっけ?