【開発環境】仮想サーバーの構築〜laravel導入まで（vagrant/centos7/apache/PHP/composer/laravel）

#ローカル開発環境の構築
この記事ではプログラミング初心者がPHPのフレームワークであるLaravelを使って開発環境を整えることを目的としています。
使用するPCはmacOSになりますのでご理解お願いします。


#1.ローカル開発環境の構築

##Vagrantをインストール

公式サイトにてダウンロードをします。
公式サイトは[コチラ](https://www.vagrantup.com/)

・Download 2.2.6を押す
![スクリーンショット 2020-01-05 16.20.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/3757e0b0-9a92-4774-3736-3a992f4eef68.png)

・macOSの64-bitをクリック

![スクリーンショット 2020-01-05 19.15.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/4d3553aa-7e14-2010-260c-2b714e0d8db5.png)

・ダウンロードしたファイルを開きます。

![スクリーンショット 2020-01-05 19.18.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/b709920e-22f5-8cc3-1138-a1ae4750ec66.png)

・インストール画面が開くので、vagrant.pkgをWクリック

![スクリーンショット 2020-01-05 19.21.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/6de61dcd-c3f2-7d6d-f9ff-df3be0d3579e.png)

・続けるをクリック

![スクリーンショット 2020-01-05 19.23.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/504aa784-8488-3e57-4cc7-2723364e5b59.png)

・インストールをクリック

![スクリーンショット 2020-01-05 19.23.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/e45058a1-dc03-8b4d-9adb-090e7149c78e.png)

・パスワードを入力して、ソフトウェアをインストールをクリック

![スクリーンショット 2020-01-05 19.24.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/ebdda9d0-7169-f65d-5992-39e4c7c50be8.png)

・インストールが完了したら、閉じるをクリックする。

![スクリーンショット 2020-01-05 19.24.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/82888404-5aa8-ba7d-166d-6a8e126dd5c7.png)

・インストールされているか確認する。下記のように入力してバージョンが表示されたらOK

```
$  vagrant -v
Vagrant 2.2.6
```

##Virtualboxをインストール

公式サイトにてダウンロードをします。
公式サイトは[コチラ](https://www.virtualbox.org/wiki/Download_Old_Builds_5_2)

・公式サイトからバージョン5.2.34のOS x hostsをクリックします。
※最新バージョンは6.1ですが、vagrantで動かせないので5.2.34を使います。

![スクリーンショット 2020-01-05 19.12.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/789326da-b344-5da7-381e-ca74b47e3db4.png)

・インストールが完了したらクリックする

![スクリーンショット 2020-01-05 19.40.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/0c87f8d8-ee43-7827-cb6c-05e5bf79a53e.png)

・インストーラーが開くので、VirtualBox.pkgをダブルクリック

![スクリーンショット 2020-01-05 19.42.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/3d084c6e-4e96-2b46-39ea-14023d05dbb9.png)

・続けるをクリック

![スクリーンショット 2020-01-05 19.44.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/df79bf66-2474-24b5-44fd-316d73c889ab.png)

・続けるをクリック

![スクリーンショット 2020-01-05 19.44.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/95bbc774-38cd-b4e0-c35d-bc5c5a515284.png)

・インストールをクリック
![スクリーンショット 2020-01-05 19.44.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/000cece3-fa23-c05a-43ba-14ad825a812b.png)

・閉じるをクリック
![スクリーンショット 2020-01-05 19.45.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/2071fac4-9f86-32c9-b8a0-6e8cb3b67955.png)

・ゴミ箱に入れるをクリック（インストーラーを削除します。）
![スクリーンショット 2020-01-05 19.45.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/487831a1-25dc-aea5-8158-6a47f435e4c9.png)

・コマンドラインでバージョンを確認します。

```
//バージョン確認
$ VBoxManage -v
5.2.34r133893
```

#vagrantboxを追加していきます。

[コチラ](https://www.vagrantbox.es)のサイトからダウンロードします。
今回はCentOS7を追加します。

・サイトを開いてコピーします。

![スクリーンショット 2020-01-05 20.06.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/88aaae93-4b23-fced-afda-5b24fc1813b3.png)

・コマンドラインでvagrant box add (title) (url)を入力してインストールします。
titleは任意の単語を入力してください。centos7.2とします。
urlは先ほどコピーしたものを貼り付けます。
※インストールには結構時間かかります。（１４分かかりました）

```
$ vagrant box add centos7.2 https://github.com/CommanderK5/packer-centos-template/releases/download/0.7.2/vagrant-centos-7.2.box

==> box: Box file was not detected as metadata. Adding it directly...
==> box: Adding box 'centos7.2' (v0) for provider: 
    box: Downloading: https://github.com/CommanderK5/packer-centos-template/releases/download/0.7.2/vagrant-centos-7.2.box
    box: Download redirected to host: github-production-release-asset-2e65be.s3.amazonaws.com
    box: Progress: 9% (Rate: 1465k/s, Estimated time remaining: 0:11:44)
==> box: Successfully added box 'centos7.2' (v0) for 'virtualbox'!
```

・インストールが完了しているか確認します。

```
$ vagrant box list //インストール可能なboxリストを確認
centos7.2 (virtualbox, 0)
```
##仮想サーバーを立ち上げていきます。

```
//仮想サーバーを管理するフォルダを作成
$ mkdir myvagrant/centos7.2
//仮想サーバーに移動
$ cd myvagrant/centos7.2
//設定ファイルを作成します。
$ vagrant init centos7.2
A `Vagrantfile` has been placed in this directory. You are now
ready to `vagrant up` your first virtual environment! Please read
the comments in the Vagrantfile as well as documentation on
`vagrantup.com` for more information on using Vagrant.
```

・設定ファイルが作成されているか確認します。Vagrantfileと表示されていれば作成

```
$ ls
Vagrantfile
```
#Vagrantfileを書き換えます。

・ipアドレスを書き換えます。
後ほどLaravelサーバーを立ち上げた際に変更しておくことで便利なので。

config.vm.network "private_network", ip: "192.168.33.10"の#を削除

```ruby:Vagrantfile
# -*- mode: ruby -*-
# vi: set ft=ruby :

# All Vagrant configuration is done below. The "2" in Vagrant.configure
# configures the configuration version (we support older styles for
# backwards compatibility). Please don't change it unless you know what
# you're doing.
Vagrant.configure("2") do |config|
  # The most common configuration options are documented and commented below.
  # For a complete reference, please see the online documentation at
  # https://docs.vagrantup.com.

  # Every Vagrant development environment requires a box. You can search for
  # boxes at https://vagrantcloud.com/search.
  config.vm.box = "centos7.2"

  # Disable automatic box update checking. If you disable this, then
  # boxes will only be checked for updates when the user runs
  # `vagrant box outdated`. This is not recommended.
  # config.vm.box_check_update = false

  # Create a forwarded port mapping which allows access to a specific port
  # within the machine from a port on the host machine. In the example below,
  # accessing "localhost:8080" will access port 80 on the guest machine.
  # NOTE: This will enable public access to the opened port
  # config.vm.network "forwarded_port", guest: 80, host: 8080

  # Create a forwarded port mapping which allows access to a specific port
  # within the machine from a port on the host machine and only allow access
  # via 127.0.0.1 to disable public access
  # config.vm.network "forwarded_port", guest: 80, host: 8080, host_ip: "127.0.0.1"

  # Create a private network, which allows host-only access to the machine
  # using a specific IP.
+  config.vm.network "private_network", ip: "192.168.33.10"

  # Create a public network, which generally matched to bridged network.
  # Bridged networks make the machine appear as another physical device on
  # your network.
  # config.vm.network "public_network"

  # Share an additional folder to the guest VM. The first argument is
  # the path on the host to the actual folder. The second argument is
  # the path on the guest to mount the folder. And the optional third
  # argument is a set of non-required options.
  # config.vm.synced_folder "../data", "/vagrant_data"

  # Provider-specific configuration so you can fine-tune various
  # backing providers for Vagrant. These expose provider-specific options.
  # Example for VirtualBox:
  #
  # 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
  #
  # View the documentation for the provider you are using for more
  # information on available options.

  # Enable provisioning with a shell script. Additional provisioners such as
  # Puppet, Chef, Ansible, Salt, and Docker are also available. Please see the
  # documentation for more information about their specific syntax and use.
  # config.vm.provision "shell", inline: <<-SHELL
  #   apt-get update
  #   apt-get install -y apache2
  # SHELL
end

```

仮想サーバーを起動する

```
$ vagrant up :仮想サーバーを起動する
$ vagrant ssh :仮想サーバーにログインする
[vagrant@localhost ~]$ 　←このようになればok
```

##とりあえずyumをアップデート

```
[vagrant@localhost ~]$ sudo yum -y update
```

##Remiリポジトリの追加

https://weblabo.oscasierra.net/centos7-php72-install/

```
[vagrant@localhost ~]$ sudo yum -y install epel-release
[vagrant@localhost ~]$ sudo yum -y install http://rpms.famillecollet.com/enterprise/remi-release-7.rpm
```

#Gitを導入していきます。

##git導入に必要な依存関係のライブラリをインストール

```
$ sudo yum install -y curl-devel gcc openssl-devel expat-devel cpan gettext wget
```



```
$ cd /usr/local/src/
$ sudo wget https://www.kernel.org/pub/software/scm/git/git-2.20.2.tar.gz 
$ sudo tar xzvf git-2.20.2.tar.gz 
```

makeコマンドでインストールする。

```
$ cd git-2.20.2
$ sudo make prefix=/usr/local all
$ sudo make prefix=/usr/local install
$ source /etc/profile
```

Gitのバージョンを確認する

```
$ git --version
git version 2.20.2
```


##apacheとPHPのインストール

```
[vagrant@localhost ~]$ sudo yum -y install --enablerepo=remi,remi-php73 php php-mbstring php-xml php-xmlrpc php-gd php-pdo php-pecl-mcrypt php-mysqlnd php-pecl-mysql
```

##apacheの起動

```
[vagrant@localhost ~]$ sudo systemctl start httpd.service
```

##apacheの自動起動も設定しておく
※次回vagrantを立ち上げた際に再度、apacheを起動するのは手間なので

```
[vagrant@localhost ~]$ sudo systemctl enable httpd.service
```

ブラウザでipアドレスを入力して確認

![スクリーンショット 2019-11-16 16.04.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/00c2000e-b775-2e7e-1206-de9977bc592a.png)



##Composerのインストール

```
[vagrant@localhost ~]$ sudo curl -sS https://getcomposer.org/installer | php
[vagrant@localhost ~]$ sudo mv composer.phar /usr/local/bin/composer
```



##laravelプロジェクトの作成

apacheで動かしたいのでディレクトリを移動しておく

```
[vagrant@localhost ~]$ cd /var/www/html 
```
/var/www/htmlはvagrantユーザーではファイル等作成できないので、rootユーザーに変わる
パスワードは「vagrant」です。

```
$ su
パスワード
```

##プロジェクトを作成します。

```
# composer create-project --prefer-dist laravel/laravel="5.5" プロジェクト名
```

##laravelサーバーの立ち上げ

```
$ php artisan serve --host ホストNo --port 8000
```

ブラウザで確認。ブラウザにホストNo:portと入力し確認
例） 192.168.33.11:8000

![スクリーンショット 2019-11-16 16.07.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/6f8196ae-a9b2-c95e-2b00-349d8ab71b48.png)



#apacheでlaravelを動かす

###apacheの設定ファイルを変更する

```
$ sudo vi /etc/httpd/conf/httpd.conf //設定ファイルを開く

#
# This is the main Apache HTTP server configuration file.  It contains the
# configuration directives that give the server its instructions.
# See <URL:http://httpd.apache.org/docs/2.4/> for detailed information.
# In particular, see
# <URL:http://httpd.apache.org/docs/2.4/mod/directives.html>
# for a discussion of each configuration directive.
・
・
・
```
##設定ファイルを書き換える

1.escボタンを押す
2. /を押す
3. DocumentRootでENTERを押す。 ※nで次に移動、Nで戻る
4. 以下のように書き換える

```
変更前：DocumentRoot "/var/www/html"
変更後：DocumentRoot "/var/www/html/プロジェクト名/public"
```
##laravelプロジェクトフォルダの配下の権限を変更する。

```
$ cd /var/www/html/myblog 　　　　:フォルダ移動
$ chmod -R 777 storage　　　　　　 :権限の変更
$ chmod -R 777 bootstrap/cache/　：権限の変更
```

###apacheを再起動する

```
$ sudo systemctl restart httpd.service
```

###SELinuxを無効にする

```
$ sudo setenforce 0
```

ブラウザで確認。ブラウザにホストNoを入力し確認
例） 192.168.33.11

![スクリーンショット 2019-11-16 16.07.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/420746/115b5aa4-3c3c-20d0-334c-59d781039977.png)


上記のように表示されればok