はじめに
今回はこんな悩みに答えていきます。
本記事の内容
■ Kusanagi for VagrantでのWordPressローカル環境構築方法
今回、以下の環境での解説となります。
OS:Mac
仮想マシン：VirtualBox
VagrantBox:KUSANAGI
WordPress:5.x
仮想サーバ：PHP7 / MariaDB / nginx
Contents
VirtualBoxのインストール方法
Vagrantは簡単にいうと、仮想マシンをコマンドラインで簡単に扱えるようにするツールです。
Vagrant自体には仮想化の機能はないため、VirtualBoxやVMwareなどの仮想マシン管理ツールをインストールしなければ使用できません。
今回は、無料で使えるVirtualBoxをインストールして使うことにします。
まず、公式サイトからインストーラをダウンロードして実行します。
https://www.virtualbox.org/wiki/Downloads
インストーラはOSに応じたインストーラを選択してください。
今回は、Macで環境構築するため、以下の画像の赤枠の「OS X hosts」を選択します。
すると、dmgファイルをダウンロードすることができるので起動してインストールしましょう。
Vagrantのインストール方法
公式サイトからインストーラをダウンロードして実行します。
https://www.vagrantup.com/downloads.html
インストール先のマシンのOSとビット数に応じたインストーラをダウンロードします。
今回は、Macで環境構築するため、「Mac OS X, 64-bit」を選択します。
すると、dmgファイルをダウンロードすることができるので起動してインストールしましょう。
KUSANAGIのVagrantBoxのインストール
WordPressのローカル環境を構築するにあたって、WordPress用超高速仮想マシンのKUSANAGIを今回使用します。
KUSANAGIを使用することで手軽にローカル環境を構築することができます。
プロジェクトフォルダ作成
まずはローカルPCの任意の場所にプロジェクトフォルダを作成します。
|
1 2 |
$ mkdir プロジェクト名 $ cd プロジェクト名 |
Vagrantファイルの作成
以下のコマンドを実行し、Vagrantファイルを作成します。
|
1 |
$ vagrant init primestrategy/kusanagi |
今回VagrantBoxは、「primestrategy/kusanagi」をインストールしたいので、上記コマンドのようにprimestrategy/kusanagiを指定します。
Vagrantファイルの編集
Vagrantfileをエディタで開いて以下の編集を行います。
以下の部分のコメントアウトを外し、3行追加後、保存します。
|
1 |
# config.vm.network "private_network", ip: "192.168.33.10" |
|
1 2 3 4 |
config.vm.network "private_network", ip: "192.168.33.10" config.vm.provider "virtualbox" do |vb| vb.customize ["modifyvm", :id, "--memory", "1024"] end |
仮想マシンの起動
以下のコマンドを実行し、仮想マシンを起動します。
|
1 |
$ vagrant up |
このとき、「primestrategy/kusanagi」というVagrantBoxがインストールされ、仮想マシンが起動します。
初回はかなり時間がかかります。
また、補足ですが、「primestrategy/kusanagi」は以下のVagrantCloudにBoxが登録されており、ここからローカルにダウンロード及びインストールしております。
仮想マシンへアクセス
以下のコマンドを実行することで、仮想マシンへアクセスできます。
|
1 |
$ vagrant ssh |
以下のようにターミナルに表示されたらOKです。
|
1 2 3 4 5 6 7 8 9 |
__ ____ _______ ___ _ _____ __________ / //_/ / / / ___// | / | / / | / ____/ _/ / ,< / / / /\__ \/ /| | / |/ / /| |/ / __ / / / /| / /_/ /___/ / ___ |/ /| / ___ / /_/ // / /_/ |_\____//____/_/ |_/_/ |_/_/ |_\____/___/ Version 8.4.2-1, Powered by Prime Strategy. [vagrant@kusanagi83 ~]$ |
KUSANAGI初期設定
ミドルウェアのアップデート
CentOSやKUSANAGIシステムのアップデートをyumを利用して行います。
仮想マシンへアクセスした状態で以下のコマンドを実行してください。
|
1 2 3 4 |
$ sudo -s ## ルートユーザーへ変更 $ yum update kusanagi -y $ yum --enablerepo=remi,remi-php56 update -y $ reboot ## 仮想マシン再起動 |
KUSANAGI初期設定
次にKUSANAGIコマンドを実行し、KUSANAGIの初期設定を行います。
|
1 2 3 |
$ vagrant ssh $ sudo -s $ kusanagi init |
以降、対話形式での初期設定が始まります。
ここで入力するパスワードはメモして控えておきましょう。
|
1 2 3 |
## タイムゾーンの設定 Search or select timezone: => Asia/Tokyoを選択 |
|
1 2 3 4 5 |
## 使用言語の設定 Select your using language. 1 : English 2 : 日本語 => 2を選択 |
|
1 2 3 4 5 |
## キーボードの種類 Select your keyboard layout. 1 : English 2 : Japanese => 2を選択 |
|
1 2 3 |
## kusanagiユーザーのパスワード設定 Changing password for user kusanagi. => パスワード入力 |
|
1 2 3 4 5 6 |
## SSH鍵認証を行う場合のパスフレーズを設定します。 ## 任意のパスフレーズを入力し、Enter(Return)キーを押します。 ## （パスフレーズは空欄のまま進めることも可能ですが、設定されることを推奨します） Generating public/private rsa key pair. Enter passphrase (empty for no passphrase): => パスワード入力 |
|
1 2 3 4 5 |
## Webサーバの選択 Please tell me your web server option. 1) NGINX(Default) 2) Apache => 1を選択 |
|
1 2 3 4 5 6 |
## 使用言語の選択 Then, Please tell me your application server option. 1) PHP7(Default) 2) HHVM 3) PHP5 => 1を選択 |
|
1 2 3 4 5 |
## DBの選択 Then, Please tell me your Database system. 1) MariaDB(Default) 2) PostgreSQL => 1を選択 |
|
1 2 3 |
## DBのパスワード設定 Enter MySQL root password. Use [a-zA-Z0-9.!#%+_-] 8 characters minimum. => パスワード入力 |
以上で初期設定完了です。
【任意】VagrantBoxの作成
Vagrantは仮想マシンの状態をBoxを作成することによって保存することができ、再利用することが可能です。
今後もWordPressの環境を構築する予定があるのであれば、WordPress開発用のVagrantBoxを作成しておくことをおすすめします。
作成したVagrantBoxを読み込むだけで、上記までの手順でやったような初期設定を毎回省略することができます。
VagrantBoxの作成方法は以下の通りです。
|
1 2 3 4 |
$ vagrant package [vm名] --output [任意の名前.box] ## 実行例 $ vagrant package default --output test-dev.box |
vm名は「$ vagrant status」で確認できます。デフォルトでは「default」です。
また、作成したVagrantBox再利用する際は以下のような手順となります。
|
1 2 3 4 5 6 7 8 |
$ vagrant box add 任意のbox名 [作成したbox名] ## Boxの追加 $ vagrant box list ## 追加されたBoxの確認 $ vagrant init 任意のbox名 ## Vagrant初期化(Vagrantfileが生成される) $ vagrant up ## 仮想マシン起動 ## 実行例 $ vagrant box add test test-dev.box $ vagrant init test |
ただし、「Vagrantfileの中身は現環境から引き継がれない」ので、新しく設定項目を追記しなおす必要があります。
WordPressの環境構築
KUSANAGIコマンドを実行し、WordPressの環境構築をしていきます。
|
1 2 3 4 |
$ kusanagi provision 任意のプロジェクト名 ## 実行例 $ kusanagi provision test ## /home/kusanagi/testというディレクトリが作成され、そこにWordPressの環境が構築されます。 |
以降、対話形式での初期設定が始まります。
ここで入力するホスト名やDB名、ユーザー名、パスワードはメモして控えておきましょう。
|
1 2 3 4 5 |
## WordPressでの使用言語 Choose the installation language of WordPress. 1 : en_US 2 : ja => 2を選択 |
|
1 2 3 |
## Webサイトのホスト名 Enter hostname(fqdn) for your website. => 任意のホスト名(例.test.local) |
|
1 2 3 4 5 |
## 無料のSSLサーバー証明書であるLet’s Encryptを使用する場合(使用しない場合は2回エンター(ローカル環境なので不要だと思います。)) In order to use Let's Encrypt services, you must agree to Let's Encrypt's Term of Services. If you agree to this TOS, type your email address; if not, hit enter twice. TOS of Let's Encrypt : https://letsencrypt.org/repository/ => メールアドレス入力 |
|
1 2 3 |
## WordPressで使用するDB名 Enter the name of your database. => 任意のDB名 |
|
1 2 3 |
## WordPressで使用するDBのユーザー名 Enter user name for database. => 任意のDBユーザー名 |
|
1 2 3 |
## 上記で設定したユーザーのパスワード Enter password for database user => パスワード入力 |
以上でWordPressの環境構築は完了です。
ホストファイルの編集
WordPressの環境構築で設定したホスト名でアクセスできるようにするために、ローカル環境でホスト名とIPの紐付けを行っているホストファイルを修正します。
ホストファイルの編集は以下のアプリを使用すると簡単に編集できます。
以下のサイトに具体的な手順が解説されているので、ご参照ください。
今回はHostsファイルに以下のような設定を行います。
| ip | 192.168.33.10 |
|---|---|
| hostname | 上記WordPress環境構築手順で設定したホスト名(例.test.local) |
WordPress初期設定
以下のURLにアクセスし、WordPress管理画面でWordPressの初期設定を行います。
http://[ホスト名]/
例. http://test.local/
すると、以下のような画面が表示されますので、赤枠部分をクリックし、WordPress初期設定を開始します。
次に、WordPressの環境構築で設定した内容を以下の画面に設定していきます。
入力に問題なければ以下のような画面に遷移しますので、赤枠部分をクリックし、次に進みます。
次にWordPressの管理画面の設定をします。
問題なければ以下のような画面に遷移しますので、赤枠部分をクリックし、ログイン画面に進みます。
ログイン画面では先程設定したユーザー名とパスワードを入力します。
ログインして以下のようなWordPress管理画面が表示されれば、初期設定完了です。
ローカルPCと仮想マシンのファイル共有設定
VagrantではローカルPCと仮想マシン間でファイルを共有することができます。
具体的には、ローカルPCで追加・修正した内容を仮想マシン側に反映したり、
逆に仮想マシン側で追加・修正した内容をローカルPC側に反映することができます。
こうすることによって、FTPソフトで仮想マシンにアクセスし、FTPソフト上でファイルを修正するという手間を省くことができ、ローカルPCのプロジェクトフォルダ内での作業で完結することができるので共有設定はしておくことをおすすめします。
まず、今回作成したプロジェクトフォルダに共有したいファイルを格納するフォルダworkspaceを作成します。
|
1 2 |
$ cd プロジェクト名 $ mkdir workspace |
次に、Vagrantfileの以下のコメントアウトの下に1行追加します。
|
1 2 |
# config.vm.synced_folder "../data", "/vagrant_data" config.vm.synced_folder "./workspace", "/home/kusanagi/test/DocumentRoot/wp-content/themes/test", :owner => "kusanagi", :group => "kusanagi", mount_options: ['dmode=777','fmode=777'] |
上記の例では、ローカルPCのworkspaceフォルダと仮想マシンのtestフォルダを共有する設定としております。
また、ファイルを作成した際、ファイルやディレクトリのオーナーがkusanagi、権限が777となるように設定しております。
ファイルを保存したら、vagrant upコマンドを実行し、共有設定完了です。
もしよかったら、下記の記事でWordPressおすすめ入門書籍や講座をまとめておりますのでお時間あれば参考にしていただければと思います^^
さいごまで読んでいただきありがとうございましたー！
知り合いから
「フリーランスエンジニアになれば、年収800万円以上の高報酬でかつ、自由な働き方をチョイスできる」
というのを聞いて、フリーランスエンジニアに興味を持ったのですが、
当時SIer企業でエンジニアをやっていたボクはなかなか一歩踏みだせませんでした。
というもの以下のような不安があったからです。
■フリーランスエンジニアってかなりの技術力がないとなれないのではないのか？
■フリーランスエンジニアって不安定なのではないのか？
■フリーランスエンジニアって人脈やコネ、営業力が必要なのではないのか？
しかし、実際にフリーランスエンジニアになってみて気づきました。
これらはすべて間違いです。
過去のボクのようにフリーランスエンジニアに興味あるけど一歩踏み出せないという方向けに
『フリーランスエンジニア転職完全ロードマップ』
という記事を書きました。
この記事読めば、どうすればフリーランスになれるのかが分かりますので、ぜひ一読ください。
