概要
Macの中に、VagrantとVirtualBox、Homesteadを用いてLaravel5（本記事は5.2）の仮想開発環境を初心者が作る備忘録。
時間が少しかかるので、コーヒーでも飲みながら気長にいきましょう。
作業環境
- PC : Macbook Air
- OS : Mac OS X 10.11.5 El Capitan
Vagrantを導入する
Vagrantは、仮想マシンの構築と開発・テスト環境の構築をまとめて行える支援ツール
公式サイトのダウンロードページから、各OS用のVagrantをダウンロードします。
ダウンロードしたファイルをクリックするとインストーラーが起動するので、指示に従ってインストールします。
VirtualBoxを導入する
VirtualBoxは、Vagrantによって構築される仮想マシンを置く、「置き場」をPC内につくりだすソフトウェア
公式サイトのダウンロードページから、各OS用のVirtualBoxをダウンロードします。
ダウンロードしたファイルをクリックするとインストーラーが起動するので、指示に従ってインストールします。
Vagrantを組み立てる
ターミナルを起動し、適宜仮想マシンであるVagrantを動かすディレクトリを作成し、その中へ移動します。
$ cd // 自身のホームディレクトリへ移動
$ mkdir HS_Vagrant // HS_Vagrant というディレクトリを作成
$ cd HS_Vagrant // 作った HS_Vagrantディレクトリの中へ移動
HS_Vagrantディレクトリの中で、以下のコマンドを実行し、Vagrant boxを追加します。
Vagrant boxは、仮想マシンであるVagrantを組み立てるための設計図のようなものです。
今回は、Homestead仕様に改造してマシンを組み立てるので、その設計図（laravel/homestead）をadd（追加）します。
$ vagrant box add laravel/homestead
==> box: Loading metadata for box 'laravel/homestead'
box: URL: https://atlas.hashicorp.com/laravel/homestead
This box can work with multiple providers! The providers that it
can work with are listed below. Please review the list and choose
the provider you will be working with.
1) virtualbox
2) vmware_desktop
Enter your choice:
VirtualBoxを使用するため、Enter your choice: 1 を入力します。
すると以下のように画面が進み、インストールが開始されます。
==> box: Adding box 'laravel/homestead' (v0.4.4) for provider: virtualbox
box: Downloading: https://atlas.hashicorp.com/laravel/boxes/homestead/versions/0.4.4/providers/virtualbox.box
通信環境にもよりますが、Successfully（完了）までかなり時間がかかります。（15分ほど）
気長に待ちます。コーヒーでもいかがでしょうか。
==> box: Successfully added box 'laravel/homestead' (v0.4.4) for 'virtualbox'!
これが出たら完了です。
Homestead仕様に改造されたマイ仮想マシンができました！
HomesteadリポジトリーのClone
gitからすごい人たちが作ってくださった、Homesteadをクローンします。
つまり、Homesteadをインストールします。
$ git clone https://github.com/laravel/homestead.git Homestead
先ほど作ったHS_Vagrantディレクトリの中に Homesteadディレクトリが作られているので、中に入って「初期化」をおこないます。
$ cd Homestead // Homestead ディレクトリの中へ移動
$ bash init.sh // Homestead を初期化
Homestead initialized! が出れば初期化の成功です。
（初期化が行われると、自身のホームディレクトリにある.homesteadという隠しディレクトリに、homestead.yamlというファイルが生成される。）
Homesteadの各種設定
$ cd // 自身のホームディレクトリへ移動
$ cd .homestead // .homestead という隠しディレクトリへ移動
以下のようにlsコマンドで中身を確認して、Homestead.yamlファイルが存在していればOK!
$ ls
Homestead.yaml after.sh aliases
viコマンドでHomestead.yamlファイルを編集する。
（※ Viエディタが苦手、どうしても無理、見たくもない、触るのが怖い！っていう人は、最悪GUIから辿ってファイルに行き着きましょう。なお、隠しディレクトリを表示したり、隠しディレクトリの中に入っていく手段は各自探してください）
$ vi Homestead.yaml
するとこんな風に開きます。
---
ip: "192.168.10.10"
memory: 2048
cpus: 1
provider: virtualbox
authorize: ~/.ssh/id_rsa.pub
keys:
- ~/.ssh/id_rsa
folders:
- map: ~/Code
to: /home/vagrant/Code
sites:
- map: homestead.app
to: /home/vagrant/Code/Laravel/public
databases:
- homestead
# blackfire:
# - id: foo
# token: bar
# client-id: foo
# client-token: bar
# ports:
# - send: 50000
# to: 5000
# - send: 7777
# to: 777
# protocol: udp
#
キーボードの「i」を押して、 -- INSERT --モードにしてください。
foldersの設定
foldersの-map: ~/Code部分を以下のように書き換えます。
Before
folders:
- map: ~/Code
to: /home/vagrant/Code
After
folders:
- map: ~/HS_Vagrant/Homestead/Code
to: /home/vagrant/Code
以上を書き換え終わったたら、[control] + cで INSERT モードを抜けて、
:wq
で上書き保存し、viエディタを終了します。
hostの追加
viエディタを終了したら、一旦自分のホームディレクトリに戻ります。
次に、~/etc/hostsへ、hostを追加します。
（localでブラウザに、http://homestead.appと打った時に、homesteadの中のlaravelがブラウザで動くための設定です。）（詳しいことは偉い人に聞いてください。）
$ cd // 自身のホームディレクトリへ移動
$ cd ../.. // ホームディレクトリの二つ上のディレクトリに移動
$ cd etc // etc ディレクトリに移動
$ sudo vi hosts // 強制的に（sudo）、hostsをviエディタで書き換える
sudoで開こうとするとパスワードを聞かれるので、自分のパソコンのパスワードを入力してください。
#
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting. Do not change this entry.
##
127.0.0.1 localhost
255.255.255.255 broadcasthost
::1 localhost
ここのファイルは各自今までの設定で多少異なっている可能性があると思います。
キーボードの「i」を押して、 -- INSERT --モードにしたら、
とにかく最後の行に以下を追記（コピペ）してください。
192.168.10.10 homestead.app
劇的ビフォーアフターはこうなります。
Before
#
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting. Do not change this entry.
##
127.0.0.1 localhost
255.255.255.255 broadcasthost
::1 localhost
After
#
# Host Database
#
# localhost is used to configure the loopback interface
# when the system is booting. Do not change this entry.
##
127.0.0.1 localhost
255.255.255.255 broadcasthost
::1 localhost
192.168.10.10 homestead.app
以上を書き換え終わったたら、また[control] + cで INSERT モードを抜けて、
:wq
で上書き保存し、viエディタを終了します。
SSH Keyの作成
etcで用事は済んだので、Homesteadディレクトリへ帰ります。
$ cd // 自身のホームディレクトリへ移動
$ cd HS_Vagrant // HS_Vagrant ディレクトリに移動
$ cd Homestead // Homestead ディレクトリに移動
SSHキーを持っていないと思うので作ります。
（持っている方は、公開キーのパスを先ほどの.homestead/homestead.yamlのauthorizeに記述してください）
$ ssh-keygen -t rsa
無心でコピペしてください。
パスフレーズを決めて、確認も込みで二回入力します。
SSHキーができました。
仮想サーバVagrantの起動と接続
いま、Homesteadディレクトリにいると思います。
念のため確認しておいてください。
確認ができたら先ほどパスを設定しているので忘れずに、Codeディレクトリを作りましょう。（最初、私は忘れた）
そして仮想サーバを立ち上げます。
$ mkdir Code // Homestead ディレクトリに、 Code ディレクトリを作成
$ vagrant up // Vagrant仮想サーバの起動
立ち上がったら、仮想サーバへSSH接続します。
$ vagrant ssh // Vagrant仮想サーバへ接続
以下のように表示されれば、接続が成功です！
Welcome to Ubuntu 14.04.4 LTS (GNU/Linux 3.19.0-25-generic x86_64)
* Documentation: https://help.ubuntu.com/
vagrant@homestead:~$
Good Job!!
とりあえず、ここでここまできた自分を褒めておきましょう。
Laravel5の導入
無事に仮想サーバのvagrant@homesteadに接続できたので、lsコマンドで中身を確認してみましょう。
vagrant@homestead:~$ ls
Code
内部にCodeディレクトリが表示されていればオッケーです。
このCodeディレクトリに移動します。
vagrant@homestead:~$ cd Code // Code ディレクトリに移動
ここにComposerを用いて、Laravel5プロジェクトを導入します。
vagrant@homestead:~/Code$ composer create-project laravel/laravel --prefer-dist PROJECT_NAME
PROJECT_NAMEには、好きな名前を入れてください。その名前のディレクトリが生成されます。
通信環境にもよると思いますが、めちゃくちゃ重くなります。
時間も少しかかりますので、二杯目のコーヒーでもどうでしょうか。
なんだかんだとインストールされていき、最後に~~~~~~ set successfully.が表示されれば成功です。
Codeディレクトリの中に新しくPROJECT_NAMEディレクトリが生成され、中にlaravel5が導入されているはずです。
lsコマンドでチェックしてみましょう。
vagrant@homestead:~/Code$ ls
PROJECT_NAME
vagrant@homestead:~/Code$ cd PROJECT_NAME
vagrant@homestead:~/Code/PROJECT_NAME$ ls
app composer.json database phpunit.xml resources tests
artisan composer.lock gulpfile.js public server.php vendor
bootstrap config package.json readme.md storage
このようになっていればオッケーです。無事、PROJECT_NAMEディレクトリにlaravel5が導入されました！
ブラウザでのレスポンス確認
さて、これで仮想環境はできたと言っても過言ではありませんが、最後にLaravel5がインストールされた仮想サーバ、vagrant@Homesteadが実際にちゃんとリクエストに対してレスポンスを返してくれるかどうかブラウザで確認しましょう。もう一息です。
そのためには.homesteadディレクトリのHomestead.yamlファイルを再度開いて、
http://homestead.app/
にリクエストを送ると、PROJECT_NAMEディレクトリをレスポンスしてくれるように設定、登録する必要があります。
まずはvagrantサーバから、一旦抜けましょう。
exitコマンドで抜けることができます。
vagrant@homestead:~/Code$ exit
logout
Connection to 127.0.0.1 closed.
logoutされて、自分のPCのディレクトリに戻っていればオッケーです。
HomesteadのSites設定
.homesteadディレクトリに移動します。先ほどと同じです。
$ cd // 自身のホームディレクトリへ移動
$ cd .homestead // .homestead という隠しディレクトリへ移動
viコマンドでHomestead.yamlファイルを再度編集します。
$ vi Homestead.yaml
viエディタが開くと思うので、キーボードの「i」を押して、 -- INSERT --モードにしてください。
今回編集するのは、先ほど編集したforderの下にあるsitesの部分です。
to:の部分を以下のように書き換えます。
Before
sites:
- map: homestead.app
to: /home/vagrant/Code/Laravel/public
After
sites:
- map: homestead.app
to: /home/vagrant/Code/PROJECT_NAME/public
PROJECT_NAMEには先ほど作ったプロジェクトの名前を入れてください。
sitesのto:以下の部分が、http://homestead.app/ にアクセスしたときに表示されるディレクトリの場所になるので、ここを先ほどのPROJECT_NAMEディレクトリにとぶように編集しました。
Vagrantの再起動
設定を変更したので、Vagrantサーバを再起動する必要があります。
Vagrantを入れているHomesteadディレクトリに戻ります。
$ cd // 自身のホームディレクトリへ移動
$ cd HS_Vagrant // HS_Vagrant ディレクトリに移動
$ cd Homestead // Homestead ディレクトリに移動
Vagrantを一旦落とします。vagrant haltコマンドで終了させることができます。
$ vagrant halt // Vagrantの終了
もう一度vagrant upコマンド起動しますが、ここで変更を適用するために少しオプションコマンドを加えます。
$ vagrant up --provision // Vagrantの起動（オプション：provision）
これでhomestead.yamlの変更内容を適用して、Vagrantサーバを再起動できました。
ブラウザでの確認
さて、仮想環境の整備と設定が整ったので、最後に実際にブラウザからリクエストを送ってみます。
お好きなブラウザ（Google Chrome, Safari, Firefoxなど）を開いて、
http://homestead.app/
とURLを入力し、接続します。
「 Laravel 5 」 とやけにかっこよく画面中心に表示されていれば大成功です！！
お疲れ様でした。
最後にコーヒーでもいかがですか？
参考サイト
- https://laravel.com/docs/5.2/homestead
- http://readouble.com/laravel/5/1/ja/homestead.html
- http://qiita.com/you-me/items/3886f072cbcbead98733
※ 執筆者が初心者なもので、勘違いや説明に不備がある点が多々あるかもしれません。
見つけた際は、適宜、コメントで指摘していただけると助かります。