Virtualbox + Vagrant でプログラミング開発環境を作成しよう【PHP】

2020/12/01

ホーム / PHP

PHPを勉強したいけどサーバー借りないといけないの？

PHPなどのプログラミングには実行環境が必要なので、サーバーが必要です。しかし、サーバープログラムが動けばオッケーなので自宅のパソコンなどのローカル環境でも開発環境を作ることができます。

Mac では標準でPHPやPythonが入っているのでそのままでも利用することができます。しかし、開発環境と、サーバーの実行環境は分けたほうが、挙動を制限できるのでセキュリティ的にも安全です。

ここでは、Virtualbox(バーチャルボックス)と Vagrant(ベイグラント) を使ってプログラミング開発環境を作成していきます。Windows、Macどちらも利用可能です。

Virtualbox は、Windows や Mac 内に別のOSをインストールするためのソフトです。Virtualbox内で作成するOSは仮想環境なので実行しているWindows、Macのファイルに影響を与えることはありません。

MAMPやXAMPPといったソフトウェアとインストールすることで同様の開発環境を作成することもできますが、PHPだけなので、のちのちPythonやRuby などの言語を利用したいときに対応できないので、Virtualbox + Vagrant 環境を作成することをおすすめします。

Virtualbox をインストール

https://www.virtualbox.org

上記ページからVirtuboxbox ダウンロードサイトへ移動します。

img
Virtualbox ダウンロード

Download Virtualbox の画像をクリックしてダウンロードページへ

img
Virtualbox ダウンロードページ

利用している環境、Windows、Macに合わせて選択してください。クリックすると自動的にダウンロードが開始されます。

img
ダウンロード開始

ダウンロードあと、クリックしてディスクをマウントしたら.pkgファイルをクリックしてインストールします。

もし、Macでエラーが出てインストール出来ない場合は、「設定 > セキュリティとプライバシー」で許可を与えるとインストールできます。

img
許可

Vagrant をインストール

https://www.vagrantup.com

Vagrant をダウンロード、インストールします。

こちらも環境に合わせてWindows、Macを選択しましょう。

ディスクをマウントして .pkg ファイルでインストールします。

img
インストール

ここからはコマンドラインでの操作となります。

「アプリケーション > ユーティリティ」の ターミナルを開きましょう。

// バージョンを確認
vagrant -v 
Vagrant 2.2.5

// Vagrant用のディレクトリを作成
cd ~
mkdir Vagrant
cd Vagrant
mkdir ubuntu (任意の名前)

開発環境のOSをインストール

ここではUbuntu(bento/ubuntu-18.04)を利用します。CentOSでもだいたい同じです。

Vagrant Boxes から好きなboxと呼ばれるテンプレートを選択することができます。

cd ~/Vagrant/ubuntu
vagrant init bento/ubuntu-18.04

vagrant init をすると、自動的にダウンロードが始まるので少し待ちましょう。

完了後、Vagrant/ubuntu ディレクトリ内に 「Vagrantfile」ができるのでエディタで編集します。

Vagrantfile の編集

とくに編集しなくても動きますが、ポートやIPアドレスを固定するために指定しておいたほうがのちのちのためになります。

// 任意のIPアドレスを設定
  config.vm.network "private_network", ip: "192.168.10.1"

// Mac から アクセスできるようにする (Webサーバー、SSH)
// geust に Macからアクセスするポートを指定してください。　
  config.vm.network "forwarded_port", guest: 80, host: 80
  config.vm.network "forwarded_port", guest: 2222, host: 22

以下のコマンドで Vagrant OS を立ち上げます。

vagrant up

いろいろ表示されますがしばらく待ちましょう。

SSHの公開鍵(秘密鍵)関連で失敗する場合は以下のようにしてあげると動くかもしれません。

cp ~/Vagrant/ubuntu/.vagrant/machines/default/virtualbox/private_key ~/.ssh/vagrant-ubuntu.key

rm -rf ~/Vagrant/ubuntu/.vagrant/machines/default/virtualbox/private_key

ln -s ~/.ssh/vagrant-ubuntu.key ~/Vagrant/ubuntu/.vagrant/machines/default/virtualbox/private_key

PHPの開発環境を構築

// Mac や Windowsで
cd ~/Vagrant/ubuntu
vagrant ssh

これで Vagrant の ubuntu にSSH 接続ができます。あとは通常のubuntu同様に操作していきます。

ちなみに デフォルトユーザー名、パスワードは、vagrant、vagrantです。

// ソフトアップデート
sudo apt update
sudo apt list --upgradable
sudo apt upgrade -y
// nginx をインストール
sudo apt install nginx -y

sudo apt install software-properties-common
sudo add-apt-repository ppa:ondrej/php
// 3. nginxを選択

// php7.3 をインストール
sudo apt install php7.3-fpm php7.3-common php7.3-gmp php7.3-curl php7.3-intl php7.3-mbstring php7.3-xmlrpc php7.3-mysql php7.3-gd php7.3-xml php7.3-cli php7.3-zip
cd /etc/nginx/sites-available/

// 元の設定ファイルをバックアップ
sudo mv default org_default

sudo vim default
server {
  listen 80;
  server_name 127.0.0.1;

  location / {
    root /var/www/html;
    index index.html index.htm index.php;
  }

  location ~ \.php$ {
    root /var/www/html;
    fastcgi_pass unix:/run/php/php7.3-fpm.sock;
    fastcgi_index index.php;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    include fastcgi_params;
  }

  location ~ /\.ht {
    deny all;
  }
}
// nignx 再起動
sudo service nginx restart

Mac と VagrantのOS のファイル共有

更新したファイルをいちいちSSH(SFTP)でファイルをアップロードするのは面倒ですよね。

Vagrantでは Mac上の「Vagrantfile」があるフォルダと、Vagrant OS上の 「/vagrant」が同期されます。

なので、Vagrantfile と同じディレクトリ内の新しいディレクトリを作って、Vagrant OSの中の「/var/www/html」とリンクさせることで、更新したファイルを反映させることが可能になります。

「/var/www/html」はnginxのデフォルトドキュメントルート(外部公開ディレクトリ)です。

このディレクトリは同期している

Mac ~/Vagrant/ubuntu
Vagrant (ubuntu) /vagrant 
cd /var/www/

// htmlディレクトリにシンボリックリンクを張るのでリネーム
sudo mv html org_html

// シンボリックリンク
sudo ln -fs /vagrant/html /var/www

PC でブラウザを立ち上げて確認

Mac で エディタで index.html を作成して、「~/Vagrant/ubuntu/html」内に保存します。ファイルの中身は適当でオッケーです。

ブラウザを開いて、「192.168.10.1 (任意)」にアクセスして編集した文字列が表示されることを確認しましょう。

もしくは、index.phpにして以下のコードを入れてphpの動作確認もできます。

<?php phpinfo();

hosts ファイル編集でかんたんアクセス

Mac であれば 「/etc/hosts」ファイルを編集することで、任意の名前やドメインでアクセス可能です。

例) 192.168.10.1 => http://programming.com

// Mac ターミナル上で
sudo vim /etc/hosts

// 追記
192.168.10.1    programming.com
192.168.10.2    test

反映されない場合

sudo killall -HUP mDNSResponder

mysql をインストール

sudo apt install mariadb-server mariadb-client -y

sudo systemctl stop mysql.service
sudo systemctl start mysql.service
sudo systemctl enable mysql.service

sudo mysql_secure_installation

- - -
Enter current password for root (enter for none): Enterをおす
Set root password? [Y/n]: Y
New password: Enter password
Re-enter new password: Repeat password
Remove anonymous users? [Y/n]: Y
Disallow root login remotely? [Y/n]: Y
Remove test database and access to it? [Y/n]:  Y
Reload privilege tables now? [Y/n]:  Y
----

sudo systemctl restart mysql.service

mysql で rootユーザーが利用できない場合

sudo mysql -u root -p
// 空で Enter

mysql> use mysql;
Database changed

mysql> select * from  user;
Empty set (0.00 sec)

mysql> truncate table user;
mysql> flush privileges;
mysql> grant all privileges on *.* to root@localhost identified by 'rootのパスワード' with grant option;
mysql> flush privileges;

mysql> quit;

sudo service mysqld restart
PHP
# Virtualbox# Vagrant