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

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 環境を作成することをおすすめします。

Mac M1 などの ARMアーキテクチャ CPU では Virtualbox および Vagrant は使えません。

Virtualbox をインストール

https://www.virtualbox.org

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

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

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

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

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

Vagrant をインストール

https://www.vagrantup.com

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

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

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

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

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

// バージョンを確認
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