こんにちは。たきもとです。
先日は301リダイレクトの設定について紹介しました。
WordPress 301リダイレクトによるパーマリンク変更方法 | たきもとけんご.com
今回はwindows8.1にvagrant,VCCWでWordPressローカル開発環境を構築する方法を紹介します。
動作環境
私の動作環境は次の通り。
- windows8.1 64bit
なぜVCCWで環境構築をしようと思ったのか
WPテーマを自作しようと思いまして。
自作のためにはローカル開発環境が必要かな、と。
WPローカル開発環境構築方法を幾つか調べる内にVCCWを知りました。
全部 ”らしい” という噂レベルで大変恐縮なのですが、次の噂を信じてVCCWに決めました。
- 複数のツール(PHP, MySQL, node.js など)を一括でinstしてくれるらしい
- ローカル開発環境→本番環境への移行が容易らしい
前者については事実確認がとれました。
無事にinstが完了したので。
後者については,私がWPテーマを無事に完成した後に報告します。
VCCWとは
まず、VCCWについて。
公式サイトはこちら。
VCCW
VCCWはWPローカル開発環境を簡単に構築できるツールである、という理解。
詳細は本家HPを見るのが一番です。
VCCWについてざっくり押さえるとしたら次の点です。
- 色々便利なツールを簡単に準備してくれる
色々ってなに? という疑問に対する答えは本家HPに書いてあります。
ここではその一部を抜粋します。
・CentOS 6.5
- Subversion
- Git
- jq
・WordPress latest
- WP-CLI
- WordPress i18n Tools
- WordPress Coding Standards for PHP_CodeSniffer
・PHP 5.4
- PHPUnit
- Composer
- phpenv
- php-build
・MySQL 5.5
・Apache
・Node.js
- grunt, grybt-cli, grunt-init
- gulp
・Ruby 2.1
- Bundler
- Wordmove
- Sass
- MailCatcher
PHPUnitはテストで使用するはず。まだ使ったことないけど。
APIを叩くのにComposerは必要でしょう。使ったことないけど。
今後きっと使うはず。
Node.jsが何なのか知らないけど、きっとjavaScriptに関係しているはず。
Rubyは触ったことないけど、いつか使う気がする。
Wordmoveは ローカル→本番 への移行に大活躍するらしい。
期待しています。
こんな感じの理解で、これからVCCWを使っていきます。
事前知識
環境構築の際、案外用語や操作で躓いたりします。
ここでは事前知識を必要最低限に絞って紹介します。
クローン
Git, GitHubを利用するときに必ず聞く言葉。
大抵の場合、GitHubにある開発環境(リポジトリ)を自分のPCに再現することをクローンと言います。
ここでは、
- GitHub上の環境をローカルにコピーするコト
という理解でokです。
VCCWをwindows8.1, vagrantで使用するまでの手順
VCCWをwindows8.1, vagrantで使用するまでの手順は次の通りです。
- VirtualBox, Vagrant, Git をインストール
- vagrant-hostsupdater pluginをインストール
- hostsのパーミッションを変更する
- VCCWをローカルにクローン
- site.ymlの修正
- vagrant up
1. VirtualBox, Vagrant, Git をインストール
VirtualBox, Vagrant, Git はHPからDLします。
DL手順は先日書いたこちらの記事を参考にして下さい。
土日で分かるPHPプログラミング教室の実践 | たきもとけんご.com
HPからDLするだけなので、悩む箇所はないと思います。
お気づきの点等御座いましたら、コメント欄よりご連絡下さい。
2. vagrant-hostsupdater pluginをインストール
VM起動時、停止時にhostsファイルの自動書換を行ってくれます。
詳細はGitHubの次のページに記載されています。
Vagrant::Hostsupdater | GitHub/cogitatio/vagrant-hostsupdater
コマンドプロンプトに次のコマンドを入力することでinstします。
vagrant plugin install vagrant-hostsupdater
3. hostsのパーミッションを変更する
VCCWインストール前に、hostsファイルのパーミッションを変更します。
hostsファイルはデフォルトでは読み取り専用になっているので、フルコントロール可に変更します。
hostsファイル変更方法
まず、次の階層までディレクトリを辿ります。
C:/WINDOWS/system32/drivers/etc/hosts
次に、 hostsファイルを
右クリック
プロパティ
セキュリティ タブ
Users を選択
編集
フルコントロール→許可 にチェック
適用
OK
パーミッションの変更は以上です。
4. VCCWをローカルにクローン
ここで、実際に自分のPCのどのディレクトリで作業を行うかを決めます。
私は次の場所で作業することにしました。
C:\Users\(ユーザ名)\Desktop\prgrm
私はデスクトップ上に prgrm というフォルダを作りました。
ここにVCCWをinstします。
コマンドプロンプトで次の階層まで降り、更にgit cloneコマンドを入力します。
cd C:\Users\(ユーザ名)\Desktop\prgrm git clone https://github.com/vccw-team/vccw.git
ここまでの作業でprgrmの下にvccwというディレクトリが作成されているはずです。
5. site.ymlの修正
vccwディレクトリ内の README.md を見てみると色々注意書きが書いてあります。
ここではsite.ymlについての作業が必要、と書いてあるのでそれに従います。
## Configuration
1. Copy `provision/default.yml` to `site.yml`.
1. Edit the `site.yml`.
1. Run `vagrant up`.
引用: vccw内のREADME.md 抜粋
ナンバリングがおかしいのですが、ざっくり意訳すると
1. provision/default.yml を site.yml としてコピー
2. site.yml を編集
3. (コマンドプロンプトで)vagrant up を実行
では、早速やってみましょう。
1. provision/default.yml を site.yml としてコピー
コマンドプロンプト上で操作してもokですし、マウスを操作してフォルダを操作してもokです。
provision下のdefault.yml を vccw直下にコピーしましょう。
コピー後、default.yml を site.yml にリネームしましょう。
2. site.yml を編集
site.yml で最低限編集するべきなのは、言語設定です。
それ以外は必要に応じて編集しましょう。
編集については次のサイトが詳しく紹介しています。
- VCCWによるWordPress用ローカル環境構築&ハマりやすいポイント | いつも隣にITのお仕事
- Windows8でVagrant(VCCW)+WordPressの環境構築 | Web Design Lyric
私は次の箇所を変更しました。
site.yml
# # WordPress Settings # version: latest lang: ja ← en_US から ja に変更 title: Welcome to the VCCW multisite: false rewrite_structure: /archives/%post_id%
” ← en_US から ja に変更” は解説のために入れています。
実際のファイルには書き込まないで下さい。
3. (コマンドプロンプトで)vagrant up を実行
あとはvagrantを起動します。
コマンドプロンプトで vccw のあるディレクトリまで移動し、次のコマンドを入力します。
cd C:\Users\(ユーザ名)\Desktop\prgrm\vccw vagrant up
6. vagrant up
先述した通り、vccwのディレクトリで vagrant up と入力するとあとは自動で環境構築をしてくれます。
次の記事でも書きましたが、初回のvagrant upは時間がかかります。
土日で分かるPHPプログラミング教室の実践 | たきもとけんご.com
時間がかかる理由は、先述した数多くのツールのinstと、データベース設定等を自動で行ってくれるからです。
通信環境によって掛かる時間はまちまちですが、終わるまで気長に待ちましょう。
instが終わったらブラウザのアドレスバーに次の様に入力します。
instが成功していれば次の様な画面になるはずです。
http://192.168.33.10/
まとめ
コマンドプロンプトに抵抗がなければVCCWは非常に楽な環境構築手段である
vagrantを利用した環境構築は世の中的に主流なのでしょうか?
私は独学なので世の中の事情に詳しくないのですが・・。
便利、便利、という話はよくネットで目にしますが、実情は
vagrantを利用すると便利!
↓
vagrant + Git を利用して一括で必要なツールがインストールできる!
必要なツールを一つ一つ手動でインストールする手間が省けて便利だよね!
というところだと思います。
確かに、こういう意味では便利です。
私はプログラミング自体でも躓きますが、環境構築ではもっと躓きます。
新しいツールや手法は若干ハードルが高く感じますが、まだまだ初心者なので今後も気合を入れて挑戦してゆきます。
参考サイト
大変お世話になりました。