Windows7でVirtualBoxとVagrantを使ってローカル開発環境を構築する

公開日: : Vagrant, VirtualBox, サイト制作

スポンサーリンク

Vagrant(ベイグラント)とは

http://www.vagrantup.comで入手できる仮想マシンを簡単に立ち上げるためのツールです。今回Windows7で何らかのWebページをローカル環境で確認できるものを構築したのでその覚書きです。

主に下記の点において非常に便利なのだと思います。
・OSや各ソフトインストール、設定など一緒くたにできて楽
・その設定を保存(boxファイル化)して他人に渡すことができる

これを使うにはVirtualBoxやVMWareなどの仮想マシンを立てるためのソフトが必要となります。私はVirtualBoxを使用しました。

私が使ったバージョンは下記の通りです
VirtualBox:5.0.16
Vagrant:1.8.1

目標は仮想マシン内のCentOSでWebサーバーを立ち上げてローカルで確認できる環境を構築することです。
  

ダウンロード先
Vagrant
VirtualBox

インストールの手順は省きます。

以下よりコマンドを打ち込む等の文言が出てきますが、これはコマンドプロンプト(cmd.exe)を立ち上げてそこに打ち込むという意味です。
Windowsだと「ls」→「dir」です。

Boxの取得

Boxファイルとは仮想マシンを作るためのテンプレートです。一度このBOXをリストに登録してしまえばあとから何度でも同じ仮想環境を構築することができるようになります。これは公式サイトから取得できます。リンク先を見ていくと下記コマンドが見つかるので、これををコマンドプロンプトを立ち上げて打ち込みます。(が、今回はCentOSを入れたいのでUbuntuの入手できる下記をやる必要はないです。次の「他のBox取得方法」で探します。)

vagrant box add hashicorp/precise64

数分~数十分かかります。完了したらBoxが登録されたか下記コマンドにて確認することができます。

vagrant box list

これで今まで導入したBOXの一覧がわかります。

他のBox取得方法

Vagrantbox.esという非公式のサイトがあるのでそこから下記コマンドにて引っ張ってくることもできますが、素性は不明なので自己判断で使用してください。私は今回ここからCentOSを入れました。

vagrant box add [名前] [URL]

例)

vagrant box add cenos64 https://github.com/tommy-muehle/puppet-vagrant-boxes/releases/download/1.0.0/centos-6.6-x86_64.box

仮想マシンを初期化

一つのテンプレートからいくつも仮想マシンを作ることができます。とりあえず仮想マシン毎にディレクトリを作成します。

 1.適当なところに仮想マシン用のフォルダを作ります
 2.コマンドラインでcdを使ってそのフォルダへ移動します
 3.「vagrant init 」コマンドにて初期化します
 4.成功するとそのフォルダに「Vagrantfile」ができます

vagrant initで使用するBOX名は「vagrant box list」で確認することができます。
あとはvagrant upで環境を構築するだけなのですが、その前に設定を変更しておきます。

Vagrantfileの設定

Vagrantfileをメモ帳などで開いて設定を変更・追加します。Vagrantfile自体はRubyで書かれているようですが特にRubyを知らなくても問題ないです。

ネットワークの設定

下記コメントアウト部分(コメントアウトは「#」です)をはずします。

# config.vm.network "private_network", ip: "192.168.33.10"

・・・がこれでvagrant upすると下記エラーが出る場合は次の変更にしてください。
vagrant up failed to create the host-only adapter

config.vm.network 'forwarded_port', guest: 80, host: 8000, host_ip: '127.0.0.1'
  config.vm.synced_folder '.', '/vagrant', disabled: true

ブラウザで確認するときのアドレスが変わります。
(192.168.33.10もしくはlocalhost:8000)

Provisionにより設定を一度に行う

VagrantfileはVagrantの設定ファイルでネットワークや初期化時に打ってほしいコマンドを指定できますので、ここで色々なソフトのインストールや設定のシェルスクリプトを指定しておくと便利です。

Provision自体はVagrantfileの下記部分をコメントアウト、もしくは追加することで利用することができます。(Rubyです)

config.vm.provision :~~~

#config.vm.provision :shell, :inline => "echo hello world"
config.vm.provision :shell, :path => "setting.sh"

上のhello worldは例です。vagrant up後に表示されるだけです。

setting.shの中身(例)

sudo yum -y install httpd
sudo service httpd start
sudo chkconfig httpd on

このシェルスクリプトを指定しておくとhttpdがインストールされ、立ち上がった状態になっています。

仮想マシンを起動

Vagrantfileのあるフォルダに移動して「vagrant up」コマンドを打ちます。テンプレート自体は何も変わらないのでまた新しく仮想マシンは作成可能です。はじめは数分くらい時間がかかります。

vagrantup
↑のような画面になります。次のSSH接続のために必要な項目を確認しておいてください。

各種コマンド

vagrant [~~]
 status:状態を見る
 suspend:一時停止する
 resume:元に戻す
 destroy:仮想マシン自体を削除する
 halt:終了
 up:立ち上げる
 reload:再起動

マシンが立ち上がったら「vagrant status」で状況を確認してみてください。「running~~」の文言があれば起動中です。

SSH接続

vagrant sshコマンドでできるが、WindowsはできないようなのでTeraTermなどのソフトを使って接続します。ここではTeraTermを使います。

vagrant_ssh1
↑確認した情報を打ちます

teraterm_secu
↑続行を押します

vagrant_ssh2
↑パスワードもvagrant

CUIが苦手という方は「WinSCP」というSSHソフトが使いやすいと思います。

vagrant_winscp
↑ドラッグ&ドロップでファイルをアップロード・ダウンロードできます(ディレクトリの権限を指定する必要がある場合がありますので、その時はTeraTermなどが必要です)

Webページを確認する

TeraTerm上で「cd /var/www/html」コマンドを打ち、公開ディレクトリへ移動します。そこで「sudo vi index.html」でindex.htmlファイルを作成します。(中身は何でも構いません)

index.html(例)

<html>
<body>
<h1>Hello World</h1>
<p>テストです</p>
</body>
</html>

http://localhost:8000/
(もしくは192.168.33.10。設定で異なる。)
をブラウザに打ち込み、移動して下記のようなのが見えていれば成功です。

helloworld_test_vagrant

自分でBOXを作る

Vagrantfileのあるディレクトリへ移動して「vagrant package」コマンド
しばらく待つと「package.box」ファイルができます。これを「vagrant box add [パッケージファイル]」コマンドでBOXに追加することもできます。

ex) vagrant box add my_box package.box

追加が完了したら.boxファイルは削除して構いません。BOX化すればprovisionの設定もあらかじめ行われるBOXファイルを作ることができます。

バッチファイルで起動させる

vagrant upまでの手順をバッチファイルにしておくと便利です。といってもvagrant upするディレクトリに移動して「vagrant up」するだけです。

例)mycentos.bat

cd C:\Users\xxx\Documents\myCentOS
vagrant up

次からはこのバッチファイルを叩けば立ち上げることができます。

スポンサーリンク
Amazon
  • このエントリーをはてなブックマークに追加

関連記事

twitterimage

【PHP】Twitterのツイート数やはてぶ数を取得する

指定URLのTweet数の取得 Twitterでツイート数を取得するには指定のURLにアクセスする

記事を読む

linkwithin_image_demo1

関連記事を表示するブログパーツまとめ

これまでいくつか関連記事を表示させる方法について記事を3つの記事投稿してきましたが、ここで簡単にまと

記事を読む

DSC_04611-600x401

【さくらサーバー】htaccessを使って拡張子無しでアクセスする

さくらサーバーで拡張子なしのアクセスする方法について非常に苦労したのでつづっておきます。私は

記事を読む

images

人気記事・ランダム記事等紹介の忍者レコメンドが大幅にパワーアップした件

以前このブログにて忍者レコメンドの紹介記事を書きました。その際にこのブログにも忍者レコメンドを設置し

記事を読む

zipimage

さくらサーバーにフォルダをアップロードする方法

さくらサーバーにフォルダをアップロードする…という機能は無いみたいで個別にFTPソフトを使う必要があ

記事を読む

_rtm0919_tp_v

スマホ向け幅固定サイトの回転時の幅対応方法

幅固定サイトでのスマホ回転時Webサイトの横幅を合わせる方法のメモ。 下記2点の設定が必要です。

記事を読む

twitterimage

【jQuery/javascript】Tweetボタンを動的に設置する

Twitterボタンをブログやサイトに設置するとき読み込みに時間がかかってしまって困るといったことや

記事を読む

zenbackpage

関連記事を手軽に表示できるzenbackの導入方法

関連記事を手軽に表示できるZenbackというサービスの紹介です。 関連記事の表示を手助けして

記事を読む

PAK12_10naname500-thumb-500xauto-3071

さくらとロリポップのcronについての比較

私は今さくらのレンタルサーバーとロリポップのレンタルサーバーを両方試してみているのですがそのcron

記事を読む

zenbackcomment1

ブログのコメント欄をTwitterやFacebook、はてなのコメントで代用する方法

最近になってコメント欄にスパムっぽいものが大量に飛んでくるようになったのでどうにかしないと、と思い一

記事を読む

encodingtype
【PHP】headerでContent-Typeを指定したのに効かない場合の対処法

PHPでサイトマップを作ろうと思い、XML形式のファイルを出力しようと

_rtm0919_tp_v
スマホ向け幅固定サイトの回転時の幅対応方法

幅固定サイトでのスマホ回転時Webサイトの横幅を合わせる方法のメモ。

rssimage
【PHP】特定のURLからそのAtomやRSSのフィードを抽出する方法

特定のURLからRSSやATOMのフィードを抽出する方法をメモ。 流

rssimage
フィード抽出ツール(RSS1.0、RSS2.0、atom)

任意URL サイト名 サイトURL RSS1.0

computer_server
格安プラン限定レンタルサーバー機能比較表(2016年)

はじめに  最近新しい共用サーバーをレンタルしようと思い調査およびそ

school_toshokan_hondana
kindle unlimitedが便利だったのでお勧めの使い方など感想メモ

 kindle unlimitedというサービスが8/3からAmazo

TAKEBE055122558_TP_V
寝る前にスマホを見ると斜視になる可能性とその対策

はじめに  寝る前などスマホを横になりながら見続けると斜視になる可能

→もっと見る

  • Author : ががんぼ
    プログラミングやWeb関係で気付いたことについてメモしていく予定。だいたいが備忘録ですが、自分でサンプルを作って動かしてみたりしています。
PAGE TOP ↑