BLOG



1809142017.png こんにちは。エンジニアの渡邉です。

突然ですが、ウェブ制作やシステム開発を、みなさんはどのような環境で進めていますか?

ウェブサイトやウェブサービスを提供するには、サーバーを立てるケースがほとんどです。また多くの場合は、社内やクライアントなどの様々な人たちが、共通の同じサーバーを利用することになります。そうなると、OSやApache・nginx、PHP、MySQLなどのバージョン管理はもちろん、あたらしいパッケージをインストールするにも各所に調整が必要になってくること必至!ましてや、エラーで見れなくなってしまったり、環境自体が壊れてしまったら、目も当てられません。

そこで今回は、普段使用しているPCに仮想環境を構築して、なにをしてもいい自分だけの開発環境を作ってみよう!というお話です。

どうやって?

今回は、Virtualbox、Vagrant、Ansibleというソフト・ツールを使って構築していきます。

正直なところ、すでにかなりメジャーな構成で、調べれば様々な情報が出てきますが、個人的にも好きな構成なので有無を言わさずこちらを採用します!

ちなみに、巷ではdockerを使う企業・エンジニアも多いですが、そのdockerの入れ物として上記構成の仮想環境を作るケースも多いです。dockerを使えるようになりたい方も、前段としてまずは上記構成を扱えるようになっておくと良いでしょう。dockerについては、また後日触れられれば。

仮想環境の構成と要件

仮想環境の構成

Macを使用している前提で、話を進めます。

  • ホストOS
    • macOS High Sierra (10.13.x)

今回作成する仮想環境は、いわゆる LAMP と呼ばれる以下の構成です。

  • 構成
    • CentOS 7
    • PHP 7
    • MySQL 5.6
    • Apache 2.4

要件

今回実現させる要件としては、以下の通り

  • ドキュメントルート配下のファイルを、ホスト(PC)とゲスト(仮想環境)で共有する
  • ホストのブラウザで、ゲストに設置したHTMLファイルがウェブページとして見られるところを目指す

必要なソフト

まずは、今回使うソフトウェア、ツールについて簡単に説明します。

  • Virtualbox
    • パソコンに仮想環境を作成するソフトのひとつです。
  • Vagrant
    • Virtualboxをはじめとした仮想環境ソフトを、より簡単に管理できるツールです。インストールしたいOSに必要な設定を定義しておくことで、いくつかのコマンドでインストールや初期設定を完了することができたり、その設定やOS自体を配布・共有できたりと、とても便利です。
  • Ansible
    • 「構成管理ツール」と呼ばれるもののひとつです。Vagrantでは設定しきれないような細かい様々な設定や構成も、管理することができます。

構築手順

必要なソフトをインストール

まずは、上記で挙げた、構築に必要なソフトをインストールしていきます。

Virtualbox

公式サイトから最新版をダウンロードして、インストールします。
この記事の時点では 5.2.18 でした。

Oracle VM VirtualBox
https://www.virtualbox.org/

Vagrant

公式サイトから最新版をダウンロードして、インストールします。
この記事の時点では 2.1.2 でした。

Vagrant by HashiCorp
https://www.vagrantup.com/

インストールが完了したら、ターミナルでコマンドを実行して、インストールがされているかを確認しましょう。

# インストール後の確認
$ vagrant -v
Vagrant 2.1.2

Ansible

こちらはターミナルでコマンドを実行してインストールします。

# インストール
$ brew install ansible

# インストール後の確認
$ ansible --version
ansible 2.6.0

Vagrantの設定

必要なソフトのインストールができたら、Vagrantを設定していきます。

新しくVagrantを作成

任意のディレクトリに移動して、そこに仮想環境を構築して行きます。 下記のコマンドを実行すると、Vagrantfileが作成されます。これが、Vagrantの設定ファイルになります。

# Vagrantを初期化
$ vagrant init

Vagrantfileに、仮想環境の設定を記述

Vagrantfileには、作成する仮想環境のOSや、割り当てるメモリ、ホストとのディレクトリ共有設定などを設定していきます。
今回変更した箇所は、以下の通り。

OSにCentOS7を指定

Vagrantでは、boxという単位で環境を管理します。
今回は、CentOS7を構築しますので、以下のように変更します。

# 元の記述
config.vm.box = "base"

# boxに centos/7 を指定
config.vm.box = "centos/7"

固定ID:192.168.33.10でアクセスできるようにする

# 以下記述のコメントアウトを外す
config.vm.network "private_network", ip: "192.168.33.10"

ホストとゲストのディレクトリを共有する

ソースコードをホストとゲストで共有するために、ディレクトリの共有する記述をします。

以下の記述では、Vagrantfileと同じ階層にある htdocsディレクトリと、CentOS(ゲスト)の /var/www/htmlディレクトリを同期させています。なお、パーミッションは雑に777としていますが、適宜変更してください。

# ディレクトリの共有の記述を書き換え

# 元の記述(コメントアウトされている)
# config.vm.synced_folder "../data", "/vagrant_data"

# 変更後
config.vm.synced_folder "./htdocs", "/var/www/html", :mount_options => [ "dmode=777", "fmode=777" ]

仮想環境に割り当てるメモリを変更

仮想環境に割り当てるメモリを変更します。
あまり大きくしてもPCが重たくなるだけですし、今回は大幅に減らして256MBにしてみましょう。

# 元の記述(コメントアウトされている)
# config.vm.provider "virtualbox" do |vb|
#   # Display the VirtualBox GUI when booting the machine
#   vb.gui = true
#
#   # Customize the amount of memory on the VM:
#   vb.memory = "1024"
# end

# 変更後(コメントアウトを外して、値を変更)
config.vm.provider "virtualbox" do |vb|
#   # Display the VirtualBox GUI when booting the machine
#   vb.gui = true
#
#   # Customize the amount of memory on the VM:
  vb.memory = "256"
end

Ansible設定のための記述を追加

Ansibleを使うための記述を追加します。

# 以下の記述を、最終行の `end` の手前に追記
config.vm.provision "ansible" do |ansible|
  # 設定を適用する対象のサーバーの指定を記述するファイルの指定
  ansible.playbook = "ansible/playbook.yml"
  # サーバーの設定をカスタマイズするためのレシピを記述する設定ファイルの指定
  ansible.inventory_path = "ansible/hosts"
  ansible.limit = 'all'
end

Ansibleの設定

次に、Ansibleの設定ファイルを作成し、記述していきます。

ansible/hosts を作成

まずは、設定を適用する対象のサーバーの指定を記述するファイルを作成します。
今回は、 ansible/hosts というファイルを新規に作成して、以下の記述を行います。

[vagrant]
192.168.33.10

ansible/playbook.yml を作成

次に、サーバーの設定をしていく設定ファイルを作成します。

今回記述した内容は、以下の通りです。

各項目で何をしているかはコメントで記載してあります。
少しボリュームがありますが、確認しながら進めていくと、より理解が進むでしょう。

面倒だったら、とりあえずコピペすれば動くはず!

---
- hosts: all
  sudo: yes
  vars:
    # MySQLのユーザーとパスワードを、変数に格納
    mysql_user_name: vagrant
    mysql_user_password: vagrant
  tasks:
    # SELinux停止
    - name: SELinuxのDisable設定
      selinux: state=disabled

    # ロケールの設定
    - name: add ja_JP.UTF-8 to locale
      shell: localedef -f UTF-8 -i ja_JP /usr/lib/locale/ja_JP.UTF-8

    - name: set locale
      shell: localectl set-locale LANG=ja_JP.utf8
      when: ansible_env.LANG | default('') != 'ja_JP.UTF-8'

    - name: set timezone to Asia/Tokyo
      timezone:
        name: Asia/Tokyo

    # Apacheをインストール
    - name: Install Apacheをインストール
      yum: name=httpd

    - name: Apacheを起動
      service: name=httpd state=started enabled=yes

    - name: .htaccessを有効にする
      replace: 
        dest=/etc/httpd/conf/httpd.conf
        regexp='AllowOverride None'
        replace='AllowOverride All'

    # PHP7.1をインストール
    - name: yum install epel-repease
      yum: name=epel-release state=installed

    - name: add remi-repo repository
      command: rpm -ih http://rpms.famillecollet.com/enterprise/remi-release-7.rpm creates=/etc/yum.repos.d/remi.repo

    - name: PHP7.1をインストール
      yum: name={{ item }} enablerepo=remi,remi-php71 state=installed
      with_items:
        - php
        - php-devel
        - php-fpm
        - php-mbstring
        - php-mcrypt
        - php-mysqlnd
        - php-pdo
        - php-xml

    - name: PHPをタイムゾーンの設定
      replace: >
        dest=/etc/php.ini
        regexp="^;date\.timezone ="
        replace="date.timezone = Asia/Tokyo"

    # MySQL5.6
    - name: MySQL5.6のリポジトリを追加
      command: >
        yum -y install http://dev.mysql.com/get/mysql-community-release-el6-5.noarch.rpm
        creates=/etc/yum.repos.d/mysql-community.repo

    - name: MySQLをインストール
      yum: name={{item}}
      with_items:
        - mysql-server
        - MySQL-python

    - name: MySQLを起動
      service: name=mysqld state=started enabled=yes

    - name: MySQLのユーザーを追加
      mysql_user: name={{ mysql_user_name }} password={{ mysql_user_password }} priv=*.*:ALL

    # Apache再起動
    - name: Apache再起動
      service: name=httpd state=restarted

ゲストOSを起動して、動作確認

以上で、下準備はおしまいです。
いよいよ、ゲストOSを起動して、動作確認してみます。

ゲストOSを起動

Vagrantを起動します。
起動すると、ここまで設定してきた内容を勝手に読み込んで、サーバーの構築を進めてくれます。

# Vagrantを起動
$ vagrant up

問題なく進んでいけば、最後に以下のようなメッセージがでて、入力画面にもどるはず。

PLAY RECAP *********************************************************************
192.168.33.10              : ok=16   changed=15   unreachable=0    failed=0

動作確認

最後に動作確認です。

ホストOSの /htdocs/ 配下にphpinfoを出力するファイルを配置して、 ゲストOSに同期され、実際にブラウザで確認します。

ファイルを作成

./htdocs/info.php

<?php phpinfo(); ?>

ブラウザでアクセス

以下のURLにアクセスします。
http://192.168.33.10/info.php

phpinfoが表示されている画面の画像

いかがでしょう。
無事に、PHPに関する情報が表示されましたでしょうか?

環境を停止・破棄

仮想環境はメモリを常に使用しますので、ゲストOSを利用しないときはサーバーを停止しておくこともできます。

# Vagrantを停止(サーバーを停止)
$ vagrant halt

また、構築した環境が不要になった場合は、以下のコマンドでゲストOSを破棄できます。

# Vagrantを破棄(サーバーを廃棄)
$ vagrant destroy

まとめ

少し(かなり?)テクニカルな内容になってしまいましたが、手順に沿って進めていただければ、とても簡単に、LAMP(Linux、Apache、MySQL、PHP)環境を構築することができます。

PCにXAMPPなどのアプリケーションをインストールすることで似たようなことを実現することが可能ですが、今回の手順は、より実際のサーバーに近いものを構築できます。たとえば Virtual Hostを設定してみたり、cronを使ってみたりといったことも、実運用に近い形で試すことができるでしょう。

今回は、LAMP環境の構築を行いましたが、VagrantfileやAnsibleのファイルの記述を変更することで、様々な組み合わせの仮想環境をPC内に構築することができるようになります。また、不要になれば破棄できる気軽さも、仮想環境の魅力のひとつ。

この記事を参考に、ぜひ快適な仮想環境ライフを送っていただければ幸いです!

サービスの成長を目指し、様々なお手伝いをしています。

シナップは、クライアントのビジネス立ち上げ、サービスの継続的発展をサポートすることを得意としている会社です。UI改善はもちろん、オウンドメディア戦略、DMP導入支援などマーケティング戦略に基づく様々な改善活動に関するご相談がございましたら、ぜひお気軽にお問い合わせください。