## ■はじめに

Laravelで作成したWebアプリケーションをHerokuの本番環境にデプロイするまでの手順をまとめます。Laravelを用いるとドキュメントルートの設定だったり、マイグレーションの設定が必要なので注意が必要です。環境変数の設定で非常に手こずりました。  
[Herokuの推奨DBがPostgreSQL](https://jp.heroku.com/postgres)だったのでDBはPostgreSQLを用います。[拡張機能](https://elements.heroku.com/addons/heroku-postgresql)もサポートされている様。  
また、手軽にstaging/production環境を作成できる[Heroku Pipeline](https://devcenter.heroku.com/articles/pipelines)を利用します。  
Webアプリケーションの開発自体はVirtualBoxにCentOSを立てて行います。

## ■構築環境
- Heroku
- Laravel 5.7.28
- PostgreSQL

## ■事前準備
### Heroku CLIのインストール

- 基本ブラウザのGUIでやる想定なので念のためインストール

```sh:bash
$ brew install heroku/brew/heroku
$ heroku --version # 確認
```

### Herokuのアカウント作成

- [こちら](https://jp.heroku.com)からアカウントを作成する
- クレジットカード情報を入力すれば無料のdyno時間が**550時間→1000時間**になるので、登録しておいた方が良い

### Herokuへログイン

```sh:bash
$ heroku login
```

## ■Heroku側の設定

### アプリの作成

- staging環境用とproduction環境用のアプリをそれぞれ作成する

### Heroku Pipelineの設定

- New > create New Pipeline を押しパイプラインを作成
- 作成したパイプラインのstaging,productionにそれぞれのアプリを割り当てる
- それぞれのアプリで**Github連携**をする(staging環境は**developブランチ**,production環境は**masterブランチ**)
- staging環境は**自動デプロイ**の設定をすることで、developへマージされると自動でアプリがデプロイされる
- **Review Apps**を有効にすることでPR作時に確認用のアプリケーションが作成される

### Review Appsの設定

1. REVIEW APPS > Enable Review Appsを押す
2. parent appにstagingのアプリを選択し`Create an app.json File`を押す
3. 後で直接編集すれば良いので、app.jsonの設定値を入力する画面はスルーでOK
4. 今回は下記の様なapp.jsonを用意する

```json:app.json
{
    "addons": [
      "heroku-postgresql"
    ],
    "buildpacks": [

    ],
    "description": "review app",
    "env": {
        /* staging環境の環境変数 */
    },
    "formation": {
    },
    "name": "<アプリ名>",
    "scripts": {
      "postdeploy": "php artisan migrate --force"
    },
    "stack": "heroku-18"
  }
```

### PostgreSQLのAdd-onの追加

1. ブラウザでHerokuにログイン
2. アプリ名 > Resources > Add-ons で`Heroku Postgres`を検索
3. `Hobby Dev -Free`を選択

## ■ソース側の設定

### Webアプリケーションの作成

- [Laravel 開発環境の構築（CentOS7）](https://qiita.com/koukibuu3/items/300ce50a9acb8674ccf3)を参考にLaravelプロジェクトを作成
- PostgreSQLの導入方法は[CentOSにPosgreSQLの環境構築](https://qiita.com/koukibuu3/items/9a409a1256a8cf02e053)を参考

### Procfileの生成

```config:Procfile
web: vendor/bin/heroku-php-apache2 public/
```

- アプリディレクトリ直下に上記Procfileを生成
- ProcfileはHerokuアプリの起動時に実行されるプロセスを記載する
- ここではApacheの使用の指定と、ドキュメントルートの設定を行う
- Procfileはきちんとコミット対象に含めること


## ■環境変数の設定

- 以下の手順をstaging環境とproduction環境両方のアプリに対して行う

### DATABASE_URLの値を元に環境変数を設定

```sh :bash
$ heroku config:get DATABASE_URL -a <アプリ名>
postgres://<ユーザ名>:<パスワード>@<ホスト名>:5432/<DB名>
```

### Heroku CLIで設定

```sh:bash
# DB種類
$ heroku config:set DB_CONNECTION=pgsql -a <アプリ名>
# ユーザ名
$ heroku config:set DB_USERNAME=<ユーザ名> -a <アプリ名>
# パスワード
$ heroku config:set DB_PASSWORD=<パスワード> -a <アプリ名>
# ホスト名
$ heroku config:set DB_HOST=<ホスト名> -a <アプリ名>
# DB名
$ heroku config:set DB_DATABASE=<DB名> -a <アプリ名>
# APPキー
$ heroku config:set APP_KEY=$(php artisan key:generate --show) -a <アプリ名>

# まとめて設定(その1)
$ heroku config:set DB_CONNECTION=pgsql DB_USERNAME=<ユーザ名> DB_PASSWORD=<パスワード> DB_HOST=<ホスト名> DB_DATABASE=<DB名> APP_KEY=$(php artisan key:generate --show) -a <アプリ名>

# まとめて設定(その2)
$ heroku config:set DB_CONNECTION=pgsql -a <アプリ名> $(heroku config:get DATABASE_URL -a <アプリ名> | awk '{print gensub(/postgres:\/\/(.+):(.+)@(.+):5432\/(.+)/, "DB_USERNAME=\"\\1\" DB_PASSWORD=\"\\2\" DB_HOST=\"\\3\" DB_DATABASE=\"\\4\"", "g")}')
```

### 設定内容の確認

```sh:bash
$ heroku config -a <アプリ名>
=== <アプリ名> Config Vars
APP_KEY:       <APPキー>
DB_CONNECTION: <DB種類>
DB_DATABASE:   <DB名>
DB_HOST:       <ホスト名>
DB_PASSWORD:   <アプリ名>
DB_USERNAME:   <ユーザ名>
```

- 正常な値がAPP_KEYの項目に設定されていないため、ここで生成された<APPキー>を、ブラウザ **(アプリ名 > Setting > Config Vars)** より、設定し直してあげる必要がある
- ここまでやれば、アプリ名 > Open app からアプリを起動することで、無事にLaravelのサンプルページが表示されているはず
- `$ heroku open -a <アプリ名>` でも可

### DBのマイグレーション

```sh:bash
$ heroku run php artisan migrate -a <アプリ名>

# マイグレーションをやり直す場合
$ heroku run php artisan migrate:refresh --seed -a <アプリ名>
```

## ■参考

- [Laravelをherokuにデプロイする(データベースはPostgreSQL)](https://qiita.com/tamappe/items/14a4e6890ecef4d49d1f)
- [Laravel + Heroku + HerokuPostgres でDB設定をサクッと環境変数に突っ込む](https://qiita.com/kamukiriri/items/1c5e17872c2fcefa1678)
- [Heroku Pipelineを使ってみる](https://qiita.com/yo-iida/items/f99566fe4617f848fa39)


■はじめに

Laravelで作成したWebアプリケーションをHerokuの本番環境にデプロイするまでの手順をまとめます。Laravelを用いるとドキュメントルートの設定だったり、マイグレーションの設

Laravel × PostgreSQL をHerokuへデプロイする

# ①Laravelのインストールとディレクトリ構成

下記を参考にphp開発環境の構築及びDBの設定が済んでいることを前提とします．

参考：[Vagrantでphp開発環境を構築(CentOS7.2)](https://qiita.com/koukibuu3/items/1f5867b8f7939d2bbfb2)

- 下記コマンドを実行してください（Laravelをインストールします）．

```bash:仮想マシン
# laravelインストーラをインストールする
$ composer global require "laravel/installer=~1.1"
# laravelプロジェクトを作成する
$ composer create-project laravel/laravel /var/www/[プロジェクト名] --prefer-dist
```

ディレクトリ構成は下記のようになっており，主にコントローラである`Http/Controllers/`と，ビューである`resources/views/`配下を編集することで開発を進めていきます．

```bash:ディレクトリ構成
app
  ├ Http/
  |  └ Controllers/
  |      ├ Auth/
  |      └ Controller.php
  ├ config/
  |  ├ app.php
  |  └ database.php
  ├ database/
  |  └ migrations/
  ├ public/
  |  ├ css/
  |  └ js/
  ├ resources/
  |  ├ assets
  |  └ views
  ├ routes/
  |  └ web.php
  └ .env
```

- `Http/Controllers/` : コントーラを配置するフォルダ．
- `config/app.php` : アプリケーション全体の設定をするファイル（ロケール情報など）．
- `config/database.php` : 接続するデータベースに関しての設定をするファイル．
- `database/migrations/` : マイグレーションファイルを配置するフォルダ．
- `public/` : 外部からアクセス可能なフォルダ．CSSやJSはここに配置する．
- `resources/views/` : ビューを配置するフォルダ．
- `routes/` : ルーティング情報を配置するフォルダ．

# ②サンプルページの作成

Laravelでviewを作成する際は，Bladeというテンプレートエンジンを用います．

今回は下記のような構成で，サンプルページを作ってみることにします．

- `layouts/common.blade.php` : ベースとなるテンプレートファイル
- `layouts/head.blade.php` : HTMLのHeadタグの中に書き込むテンプレートファイル
- `layouts/header.blade.php` : ヘッダーのテンプレートファイル
- `layouts/footer.blade.php` : フッターのテンプレートファイル
- `pages/sample.blade.php` : サンプルページのビューファイル（ページごとに作成します）

テンプレートファイルは，layout/ディレクトリを作ってその配下に，ビューファイルはpages/ディレクトリを作ってその配下に配置しました．これらの配置場所によって，呼び出す際の指定方法が変わってくるので気をつけてください．


参考：[Blade テンプレートについて - Laravel学習帳](http://laraweb.net/knowledge/2174/)
参考：[LaravelのBladeテンプレートでレイアウト部分を共通にする](http://cly7796.net/wp/php/to-a-common-layout-in-blade-template-of-laravel/)

```html:common.blade.php
<!DOCTYPE HTML>
<html lang="ja">
<head>
    {{-- Head部分 --}}
    @yield('head')
</head>
<body>
    {{-- ヘッダー部分 --}}
    @yield('header')

    <div class="container">

    <div class="main">
        {{-- コンテンツ部分 --}}
        @yield('content')
    </div>

    <div class="sub">
        {{-- サブコンテンツ部分 --}}
        @yield('sub')
        {{-- ページサブコンテンツ部分 --}}
        @yield('pageSub')
    </div>

    </div>
    {{-- フッター部分 --}}
    @yield('footer')
</body>
```

```html:head.blade.php
@section('head')
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<title>Laravelサンプルサイト | @yield('title')</title>
<meta name="description" content=@yield('description')>
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">

<link type="text/css" href="{{asset('/css/app.css')}}" rel="stylesheet">
@yield('pageCss')
@stop
```

```html:header.blade.php
@section('header')
<header class="header">
    <h1>Laravelサンプルサイト</h1>
</header>
@stop
```

```html:footer.blade.php
@section('footer')
<footer class="footer">
    <small>@created by koukibuu3</small>
</footer>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="{{{asset('/js/app.js')}}}"></script>
@yield('pageJs')
@stop
```

```html:sample.blade.php
{{-- レイアウトの読み込み --}}
@extends('layouts.common')

{{-- CSSの読み込み --}}
@section('pageCss')

<link type="text/css" href="{{asset('/css/sample.css')}}" rel="stylesheet">
@stop

@section('title')
サンプルページ
@stop

{{-- Headの読み込み --}}
@include('layouts.head')

{{-- ヘッダーの読み込み --}}
@include('layouts.header')

{{-- メインコンテンツ --}}
@section('content')
    <h2>This is sample page.</h2>
    <table>
        <tr>
            <th>ID</th>
            <th>NAME</th>
            <th>EMAIL</th>
        </tr>
        <?php foreach ($data as $val) { ?>
        <tr>
            <td><?php echo $val->id; ?></td>
            <td><?php echo $val->name; ?></td>
            <td><?php echo $val->email; ?></td>
        </tr>
        <?php } ?>
    </table>
@stop

{{-- JSの読み込み --}}
@section('pageJs')

<script type="text/javascript" src="{{{asset('/js/sample.js')}}}"></script>
@stop

{{-- フッターの読み込み --}}
@include('layouts.footer')
```

①Laravelのインストールとディレクトリ構成

下記を参考にphp開発環境の構築及びDBの設定が済んでいることを前提とします．

参考：Vagrantでphp開発環境を構築(CentOS7.2)


Laravel 開発環境の構築（CentOS7）

# PostgreSQL

## ■ インストール
やはり便利なのでyumを使ってインストールします。

yumのベースリポジトリにあるpostgreSQLはバージョンが古かったです。

```bash:ターミナル(仮想マシン)
$ yum list | grep postgresql-server
postgresql-server.x86_64                 9.2.24-1.el7_5                  base
```

なので最新のバージョンのリポジトリを追加してインストールします。

```bash:ターミナル(仮想マシン)
# pgdg96リポジトリを追加する
$ sudo yum install -y https://yum.postgresql.org/9.6/redhat/rhel-7-x86_64/pgdg-redhat96-9.6-3.noarch.rpm

# PostgreSQLサーバーをインストールする
$ sudo yum install -y postgresql96-server postgresql96-contrib

# バージョンの確認
$ psql -V
psql (PostgreSQL) 9.6.12
```

参考：[CentOS7.3にPostgreSQL9.6.3をインストールしてみた](https://qiita.com/uhooi/items/44ed9370740c7521dce4)

## ■ データベース作成と起動

### スーパーユーザの作成

データベースの管理をすることになるスーパーユーザの作成を行います。

```bash:ターミナル(仮想マシン)
# ユーザの追加
$ sudo useradd postgres
$ sudo passwd postgres
```

### データベースクラスタの作成

データベースの格納領域であるデータベースクラスタを作成します。
`/home/postgres/data`はデータベースクラスタを作成するディレクトリです。

#### 方法①

```bash:ターミナル(仮想マシン)
# postageユーザに切り替え
$ su postage
# データベースクラスタの作成
$ initdb -D /home/postgres/data --encoding=UTF8 --no-locale
```

※`initdb`を実行したユーザがデータベースクラスタの管理ユーザとして設定(ディレクトリの権限・所有者も変更されます)され、また同名のデータベースユーザが初期ユーザとして作成されます。

#### 方法②

この作業は実は下記コマンドでも行うことができます。その方がディレクトリの準備とかしなくて良いしラクかもしれません。

```bash:ターミナル(仮想マシン)
# データベースの初期化処理を行う
$ sudo /usr/pgsql-9.6/bin/postgresql96-setup initdb
```

※この場合、データベースクラスタのディレクトリはデフォルトで`/var/lib/pgsql/9.6/data`になっているので注意してください。

※この方法でデータベースクラスタを作成した場合は、データベースの初期ユーザとして`postgres`が作成されています。

### PATHを通す

1. 環境変数`PATH`に`/usr/pgsql-9.6/bin`を追加します。 
2. 環境変数`LD_LIBRARY_PATH`に`/usr/pgsql-9.6/lib`を定義します。
3. 環境変数`PGDATA`に`/home/postgres/data`を定義。※これをすることで、毎回`-D /home/postgres/data`とデータベースクラスタのディレクトリを指定しなくても良くなります。

### PostgreSQLサーバの起動

#### 方法①

pg_ctlコマンドを使ってPostgreSQLを管理します。

```bash:ターミナル(仮想マシン)
# PostgreSQLサーバの起動
$ pg_ctl start -w

# PostgreSQLサーバの終了
$ pg_ctl stop
```

※自動起動設定をするには、スクリプトを書く必要があるようです。

参考：[PostgreSQL 8.1.4 起動と自動起動設定](https://kazmax.zpp.jp/pgsql/pgsql2.html#ah_4)

#### 方法②

mysqlと同じようにsystemdを使ってPostgreSQLの起動・終了を行うことができます。
systemdを利用することにより自動起動設定も超ラクに出来るので、使わない手は無いと思います。

```bash:ターミナル(仮想マシン)
# 起動
$ systemctl start postgresql-9.6.service

# 自動起動設定
$ systemctl enable postgresql-9.6.service

# 終了
$ systemctl stop postgresql-9.6.service
```

mysqlと完全に一緒ですね。

## ■ データベース接続とデータの作成

### データベースユーザの作成

データベース一覧を表示する`psql -l`を実行したところ、roleが存在しないのでアクセスできませんでした。

```bash:ターミナル(仮想マシン)
# データベース一覧を表示
$ psql -l
psql: FATAL:  role "vagrant" does not exist
```

#### 方法①

```bash:ターミナル(仮想マシン)
# postgresユーザに切り替え
$ su postgres

# ユーザの作成
$ createuser -d -U postgres -P {ユーザ名}
```

※`createuser`は対話式でもユーザの作成が出来るらしいんですけど、上手く実行できませんでした…

#### 方法②

`postgres`ユーザでデータベースにログインしてユーザを作成する場合は下記で行う。

```bash:ターミナル(仮想マシン)
$ psql
psql (9.6.12)

postgres=# create role vagrant login createdb password 'vagrant';
```

### データベースへのログイン

続く…




PostgreSQL

■ インストール
やはり便利なのでyumを使ってインストールします。

yumのベースリポジトリにあるpostgreSQLはバージョンが古かったです。

$ yum list 

CentOSにPosgreSQLの環境構築


```
    "workbench.colorCustomizations": {
        // エディタ関連
        "editor.background": "#2c2c2c",
        "editor.lineHighlightBackground": "#333333",

        // タブ関連
        "tab.activeBackground": "#2c2c2c",
        "tab.activeBorder": "#2c2c2c",
        "tab.inactiveBackground": "#262626",
        "tab.inactiveBorder": "#262626",

        // ステータスバー関連
        "statusBar.background":"#262626",
        "statusBar.noFolderBackground": "#9c9c9c",
        "statusBar.noFolderForeground": "#000000",
        "statusBar.debuggingBackground": "#da3b01",
        "statusBar.border": "#262626",

        // スクロールバー関連
        "scrollbarSlider.hoverBackground": "#9c9c9c2d",

        // サイドバー関連
        "sideBar.background": "#262626",
        "list.hoverBackground": "#2c2c2c",
    },
```



    "workbench.colorCustomizations": {
        // エディタ関連
        "editor.background": "#2c2c2c",
  

VSCode オレ的設定メモ

## 目的

- 勉強の一貫で記事をまとめる．
- VirtualBox上にPHPの開発環境を構築する．

前回：[Vagrantで開発環境を構築（2.仮想環境設定編）](https://qiita.com/koukibuu3/items/8056d23219784587a90f)
今回：Vagrantで開発環境を構築（3.PHP開発環境編）
次回：[Laravel 開発環境の構築（CentOS7）](https://qiita.com/koukibuu3/items/300ce50a9acb8674ccf3)

## Apacheのインストール

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ sudo yum install httpd # Apacheをインストールする

$ httpd -v    # 確認
```

**2. `/etc/httpd/conf/httpd.conf` を編集する．**

```conf:httpd.conf
User vagrant    # 66行目

Group vagrant    # 67行目
```

**3. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ sudo systemctl start httpd # Apacheを起動

$ sudo systemctl enable httpd # Apacheの自動起動を有効化
```

**4. ApacheのWelcome画面にアクセスしてみる．**

http://192.168.33.10/ もしくは http://localhost:8000 にブラウザでアクセス．
ここまでの手順が正常に済んでいればWelcome画面が表示されるはず．


## phpのインストール

phpをインストールするには，EPELリポジトリ，Remiリポジトリを追加する必要がある．

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ sudo yum install epel-release # EPELリポジトリを追加

$ sudo rpm -Uvh http://rpms.famillecollet.com/enterprise/remi-release-7.rpm # RPMリポジトリを追加

$ yum install --enablerepo=remi,remi-php70 php php-devel php-mbstring php-pdo php-mysqlnd php-xml # PHP，他各種パッケージをインストール

$ php -v # 確認
```

参考：[yumリポジトリ追加リスト 完全版](https://qiita.com/bezeklik/items/9766003c19f9664602fe)
参考：[【yum入門】epel, remiなどのレポジトリをyumに追加する方法](https://uxmilk.jp/9315)

**2. `/etc/httpd/conf/httpd.conf` を編集する．**

```conf:httpd.conf
AllowOverride All # 103行目，125行目，151行目

DirectoryIndex index.php index.html # 164行目
```

**3. Apacheを再起動する．**

```Bash:ターミナル
$ sudo systemctl restart httpd.service # Apacheを再起動
```

**4. サンプルページを作成する．**

`/var/www/html` 配下に`index.php`を作成する．

```php:index.php
<?php
    echo 'Hello world.';
?>
```

再び http://192.168.33.10/ にアクセスすると `Hello world.` が出力されていることが確認できる．

## composer のインストール

[composer](https://getcomposer.org)は，依存性管理ツールというもので，フレームワーク等を使って開発するときにもとても役に立つ代物．

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ curl -sS https://getcomposer.org/installer | php # composerをインストール

$ sudo mv composer.phar /usr/local/bin/composer

$ composer -V # 確認
```

参考：[PHP開発でComposerを使わないなんてありえない！基礎編](https://qiita.com/niisan-tokyo/items/8cccec88d45f38171c94)

## mariaDBのインストール

参考：[mariaDBとは](https://www.heartcore.co.jp/lineup/mariadb/index.html)

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ sudo yum remove mariadb marinadb-libs # インストール済みのmariaDBを削除
```

**2. `/etc/yum.repos.d/MariaDB.repo`にインストール元を追加する．**

```conf:MariaDB.repo
[mariadb]
name = MariaDB
baseurl = http://yum.mariadb.org/10.1/centos7-amd64
gpgkey=https://yum.mariadb.org/RPM-GPG-KEY-MariaDB
gpgcheck=1
```

**3. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ sudo yum install --enablerepo=mariadb MariaDB-common MariaDB-devel MariaDB-shared MariaDB-compat MariaDB-server MariaDB-client # mariaDBをインストール
```

**4. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ sudo systemctl start mariadb.service # mariaDBを起動

$ sudo systemctl enable mariadb.service # mariaDBの自動起動を有効化
```

**5. テスト接続をする．**

```sql:ターミナル
$ mysql -u root

MarinaDB [(none)]> SHOW DATABASES;
MarinaDB [(none)]> USE test;
MarinaDB [test]> SHOW TABLES;
MariaDB [test]> CREATE TABLE sample (id int auto_increment, name varchar(30), index(id));
MariaDB [test]> insert into sample (name) values ('Yamada Taro');
MariaDB [test]> insert into sample (name) values ('Tanaka Hanako');
MariaDB [test]> exit
```

**6. PHPからも接続してみる．**

```php:index.php
<?php
    $dsn = 'mysql:dbname=test';
    $user = 'root';
    $pass = '';

    try
    {
        $db = new PDO($dsn,$user,$pass);
        $sql = "SELECT * FROM sample";
        foreach ($db -> query($sql) as $row)
        {
            echo($row['id'] . ":" . $row['name'] . "<br>");
        }
    }
    catch(PDOException $e)
    {
        die("die");
    }
    $db=null;
?>
```

再び http://192.168.33.10/ にアクセス


## まとめ

以上で仮想環境の設定が完了．
次回からはPHPのフレームワークの開発環境を構築していく．

前回：[Vagrantで開発環境を構築（2.仮想環境設定編）](https://qiita.com/koukibuu3/items/8056d23219784587a90f)
今回：Vagrantで開発環境を構築（3.PHP開発環境編）
次回：[Laravel 開発環境の構築（CentOS7）](https://qiita.com/koukibuu3/items/300ce50a9acb8674ccf3)


目的

勉強の一貫で記事をまとめる．
VirtualBox上にPHPの開発環境を構築する．

前回：Vagrantで開発環境を構築（2.仮想環境設定編）
今回：Vagrantで開発環境を構築（

Vagrantで開発環境を構築（3.PHP開発環境編）

## 目的

- 勉強の一貫で記事をまとめる．
- VagrantとVirtualBoxで仮想環境を作成できるようになる．

前回：[Vagrantで開発環境を構築（1.仮想マシン作成編）](https://qiita.com/koukibuu3/items/1a0e13d016d758042da6)
今回：Vagrantで開発環境を構築（2.仮想環境設定編）
次回：[Vagrantで開発環境を構築（3.PHP開発環境編）](https://qiita.com/koukibuu3/items/11f55f18aa00f1c1009d)

## yumの更新

CentOSでは，パッケージをインストールしたり管理したりするために，[yum](https://uxmilk.jp/9715)というパッケージ管理ソフトを利用する．
まず最初に，既にインストールされているyumを最新版にアップデートする．

**1. ターミナル(仮想マシン)で下記のコマンドを実行．**

```Bash:ターミナル(仮想マシン)
$ sudo yum update # yumパッケージを更新
```

yum のアップデートをする際に，下記のエラーが発生する場合がある．

```Bash:エラーメッセージ
The GPG keys listed for the "Puppet Labs PC1 Repository el 7 - x86_64" repository are already installed but they are not correct for this package. Check that the correct key URLs are configured for this repository.   Failing package is: puppet-agent-1.8.2-1.el7.x86_64 GPG Keys are configured as: file:///etc/pki/rpm-gpg/RPM-GPG-KEY-puppetlabs-PC1
```

その場合は、

```Bash:ターミナル(仮想マシン)
$ curl -L https://yum.puppetlabs.com/RPM-GPG-KEY-puppet -o /tmp/RPM-GPG-KEY-puppet

$ gpg --with-fingerprint "/tmp/RPM-GPG-KEY-puppet"

$ sudo cp /tmp/RPM-GPG-KEY-puppet /etc/pki/rpm-gpg/RPM-GPG-KEY-puppetlabs-PC1
```

を実行して`$ sudo yum update`をやり直す．

参考：[Solution for CentOS 7.2 GPG Key Issue while updating yum](http://deblock-technologies.com/centos-7-2-gpg-key-issue/)

## firewallの無効化

**1. ターミナル(仮想マシン)で下記のコマンドを実行．**

```Bash:ターミナル(仮想マシン)
$ sudo systemctl stop firewalld # firewallを無効化

$ sudo systemctl disable firewalld # firewallの自動起動を無効化

$ systemctl status firewalled # 確認
```

## SELinux の無効化

**1. 以下の設定ファイルを修正する．**

```config:/etc/selinux/config
# This file controls the state of SELinux on the system.
# SELINUX= can take one of these three values:
#     enforcing - SELinux security policy is enforced.
#     permissive - SELinux prints warnings instead of enforcing.
#     disabled - No SELinux policy is loaded.
### Disalbe SELINUX begin
##SELINUX=enforcing
  ↓
SELINUX=disabled # ココ
### Disalbe SELINUX end
# SELINUXTYPE= can take one of three two values:
#     targeted - Targeted processes are protected,
#     minimum - Modification of targeted policy. Only selected processes are protected.
#     mls - Multi Level Security protection.
SELINUXTYPE=targeted
```

**2. ターミナル(仮想マシン)で下記のコマンドを実行．**

```Bash:ターミナル(仮想マシン)
$ sudo shutdown -r now # OSを再起動する．
```

## git, vimのインストール

開発には必需な[git](https://git-scm.com)と何かと便利な**vim**をインストールする．

**1. ターミナル(仮想マシン)で下記のコマンドを実行．**

```Bash:ターミナル(仮想マシン)
$ sudo yum install git # gitのインストール

$ sudo yum install vim # vimのインストール

$ sudo yum install zip unzip # zip,unzipのインストール
```

**2. ターミナル(仮想マシン)で下記のコマンドを実行**

```Bash:ターミナル(仮想マシン)
# ユーザ名とメールアドレスを設定
$ git config --global user.name "<ユーザ名>"
$ git config --global user.email "<メールアドレス>"

# gitで使用するデフォルトのエディタをvimに変更
$ git config --global core.editor 'vim -c "set fenc=utf-8"'

# gitコマンドの結果に色をつける
$ git config --global color.ui true

# push方法を指定する(Git 1.8系以降の場合)
$ git config --global push.default simple

$ git config --list # 確認
```

参考：[git push時に表示されるwarning: push.default is unset...の意味と解決方法](https://qiita.com/yaotti/items/a8e9f5de8dcca81d3214)

**3. vimのカスタマイズ**

`~/`配下に`.vimrc`を作成（これだけでvim の使い勝手が抜群に良くなる）．

```vim:.vimrc
"文字コードをUFT-8に設定
set fenc=utf-8
" バックアップファイルを作らない
set nobackup
" スワップファイルを作らない
set noswapfile
" 編集中のファイルが変更されたら自動で読み直す
set autoread
" バッファが編集中でもその他のファイルを開けるように
set hidden
" 入力中のコマンドをステータスに表示する
set showcmd

" 行番号を表示
hi Comment ctermfg=gray
set number
" 現在の行を強調表示
set cursorline
" 行末の1文字先までカーソルを移動できるように
set virtualedit=onemore
" インデントはスマートインデント
set smartindent
" ビープ音を可視化
set visualbell
" 括弧入力時の対応する括弧を表示
set showmatch
" ステータスラインを常に表示
set laststatus=2
" コマンドラインの補完
set wildmode=list:longest
" 折り返し時に表示行単位での移動できるようにする
nnoremap j gj
nnoremap k gk

" 不可視文字を可視化(タブが「▸-」と表示される)
set list listchars=tab:\▸\-
" Tab文字を半角スペースにする
set expandtab
" 行頭以外のTab文字の表示幅（スペースいくつ分）
set tabstop=2
" 行頭でのTab文字の表示幅
set shiftwidth=2

" 検索文字列が小文字の場合は大文字小文字を区別なく検索する
set ignorecase
" 検索文字列に大文字が含まれている場合は区別して検索する
set smartcase
" 検索文字列入力時に順次対象文字列にヒットさせる
set incsearch
" 検索時に最後まで行ったら最初に戻る
set wrapscan
" 検索語をハイライト表示
set hlsearch
" ESC連打でハイライト解除
nmap <Esc><Esc> :nohlsearch<CR><Esc>
```

参考：[何も考えず~/.vimrcにこれを書くんだ！ 〜vim初心者によるvim初心者のためのvim入門〜](https://qiita.com/morikooooo/items/9fd41bcd8d1ce9170301)

## 最適化

よく分からないけど設定する必要があるらしい（ホント要勉強）．

```Bash:ターミナル(仮想マシン)
$ sudo yum clean all

$ sudo dd if=/dev/zero of=/EMPTY bs=1M

$ sudo rm -f /EMPTY
```

## まとめ

以上で仮想環境の設定が完了．
次回からはPHPの開発環境を構築していく．

前回：[Vagrantで開発環境を構築（1.仮想マシン作成編）](https://qiita.com/koukibuu3/items/1a0e13d016d758042da6)
今回：Vagrantで開発環境を構築（2.仮想環境設定編）
次回：[Vagrantで開発環境を構築（3.PHP開発環境編）](https://qiita.com/koukibuu3/items/11f55f18aa00f1c1009d)


目的

勉強の一貫で記事をまとめる．
VagrantとVirtualBoxで仮想環境を作成できるようになる．

前回：Vagrantで開発環境を構築（1.仮想マシン作成編）
今回：Vagrant

Vagrantで開発環境を構築（2.仮想環境設定編）

## 目的

- 勉強の一貫で記事をまとめる．
- VagrantとVirtualBoxで仮想環境を作成できるようになる．

前回：[Vagrantで開発環境を構築（0.事前準備編）](https://qiita.com/koukibuu3/items/1f5867b8f7939d2bbfb2)
今回：Vagrantで開発環境を構築（1.仮想マシン作成編）
次回：[Vagrantで開発環境を構築（2.仮想環境設定編）](https://qiita.com/koukibuu3/items/8056d23219784587a90f)

## boxの追加

[Vagrant](https://www.vagrantup.com)では，構築する仮想マシンのOSのイメージファイル等をまとめたboxを用いる．

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ vagrant box add <box名> https://github.com/CommanderK5/packer-centos-template/releases/download/0.7.2/vagrant-centos-7.2.box # CentOS7.2のboxをインストールして追加

$ vagrant box list # 確認
```

## 定義ファイルの作成

先ほど追加したboxを用いて仮想マシンの定義ファイルを作成．

**1. プロジェクトディレクトリに移動して，下記コマンドを実行．**

```Bash:ターミナル
$ vagrant init <box名(任意)>　# Vagrantfileを作成

$ ls # 確認
```

参考：[Vagrantの使い方](https://qiita.com/skinoshita/items/57ac059ff8b1008f5e1d)

**2. Vagrantfileを編集．**

先ほどのコマンドを実行すると，プロジェクトディレクトリに仮想マシンの定義ファイルであるVagrantfileが作成されている．
今回はこのVagrantfile に対して最低限の下記の編集を行う．
（細かい設定はよく分からないので要勉強．）

```Bash:Vagrantfile
# config.vm.network "private_network", ip: "192.168.33.10"
  ↓
config.vm.network "private_network", ip: "192.168.33.10" # 35行目辺り

# config.vm.network "forwarded_port", guest: 80, host: 8080
  ↓
config.vm.network "forwarded_port", guest: 80, host: 8080 # 26行目辺り

# config.vm.synced_folder "../data", "/vagrant_data"
  ↓
config.vm.synced_folder "./", "/var/www" # 46行目辺り
```

参考：[VagrantコマンドとVagrantfileの設定メモ](https://qiita.com/pugiemonn/items/bcd95a35c3ec7624cd61)

**3. 仮想マシンの起動**

ターミナルで下記のコマンドを実行．

```Bash:ターミナル
$ vagrant up # 仮想マシンを起動

$ vagrant status # 確認
```

（仮想マシンを終了させるには，`$ vagrant halt` を実行．）

**4. Vagrantプラグインのインストール**

`$ vagrant up` で仮想マシンを起動するときに下記のエラーメッセージが出て，共有フォルダのマウントに失敗することがある．

```Bash:エラーメッセージ
Failed to mount folders in Linux guest. This is usually because
the "vboxsf" file system is not available. Please verify that
the guest additions are properly installed in the guest and
can work properly. The command attempted was:

mount -t vboxsf -o uid=`id -u vagrant`,gid=`getent group vagrant | cut -d: -f3`,dmode=777,fmode=666 vagrant /vagrant
mount -t vboxsf -o uid=`id -u vagrant`,gid=`id -g vagrant`,dmode=777,fmode=666 vagrant /vagrant

The error output from the last command was:

/sbin/mount.vboxsf: mounting failed with the error: No such device
```

これは，VirtualBoxのアップデート後に起きる可能性があり，フォルダ共有機能を提供している**Guest Additions**をvagrant up時に自動的に更新してくれるプラグイン`vagrant-vbguest`をインストールしておくことで解決できる．
なので，エラーが起きなくてもインストールしておくのがオススメ．

ターミナルで下記のコマンドを実行．

```Bash:ターミナル
$ vagrant plugin install vagrant-vbguest
```

再び`$ vagrant up` することで更新がされる．

参考：[Vagrantで共有フォルダのマウントに失敗するときの対処方法](https://qiita.com/ozawan/items/9751dcfd9bd4c470cd82)

## 仮想マシンにssh接続する

とうとう仮想マシンに接続する．

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ vagrant ssh # 仮想マシンにssh接続する

# 192.168.33.10 ssh でもOK
```

## まとめ

以上で仮想マシンの作成が完了．
次回から実際に仮想マシンの環境を整えていく．

前回：[Vagrantで開発環境を構築（0.事前準備編）](https://qiita.com/koukibuu3/items/1f5867b8f7939d2bbfb2)
今回：Vagrantで開発環境を構築（1.仮想マシン作成編）
次回：[Vagrantで開発環境を構築（2.仮想環境設定編）](https://qiita.com/koukibuu3/items/8056d23219784587a90f)


目的

勉強の一貫で記事をまとめる．
VagrantとVirtualBoxで仮想環境を作成できるようになる．

前回：Vagrantで開発環境を構築（0.事前準備編）
今回：Vagrantで開発

Vagrantで開発環境を構築（1.仮想マシン作成編）

## 目的

- 勉強の一貫で記事をまとめる．
- パッケージ管理ツールの準備をする（Mac）．
- 仮想環境を構築するツールの準備をする．

今回：Vagrantで開発環境を構築（0.事前準備編）
次回：[Vagrantで開発環境を構築（1.仮想マシン作成編）](https://qiita.com/koukibuu3/items/1a0e13d016d758042da6)


## Xcodeのインストール（Mac）

Xcodeは，iPhoneアプリなどを製作する際に必要な強力な開発ツール．
今回は，後述する**Homebrew**のインストールに必要なのでインストール．

**1. AppStoreからインストールする．**
**2. Xcodeを一度起動する．セットアップが終了したら閉じてOK．**
**3. ターミナルで下記コマンドを実行する．**

```Bash:ターミナル
$ xcode-select --install # Xcodeのコマンドラインツールをインストール
```

## Homebrewのインストール（Mac）

[Homebrew](https://brew.sh/index_ja)は，Macで使用が可能なパッケージ管理ツール．
＊ Windowsには[Chocolatey](https://chocolatey.org)というものがあるらしい．

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" # Homebrewのインストール

$ brew doctor    # 確認
```

■ 覚えておきたいコマンド一覧

```Bash:ターミナル
$ brew doctor # Homebrewを環境診断

$ brew install <フォーミュラ名> # インストール

$ brew uninstall <フォーミュラ名> # アンインストール

$ brew update # Homebrewのデータベースを更新

$ brew upgrade # インストール済みのフォーミュラを更新

$ brew upgrade <フォーミュラ名> # 指定したフォーミュラを更新

$ brew list # インストール済みのフォーミュラを一覧表示

$ brew search <キーワード> # フォーミュラを検索

$ brew cleanup # 古いバージョンのフォーミュラを削除
```

参考：[MacにHomebrewを導入する方法](https://qiita.com/balius_1064/items/ac7dff5ef10eaf69996f)
参考：[備忘録_最低限必要なbrewコマンド一覧](https://qiita.com/y_sekitoba/items/ad0757b74c10ea3f0324)


## Homebrew Cask のインストール（Mac）

[Homebrew Cask](http://caskroom.io)はHomebrewの拡張で，Homebrewではインストール出来ないものもインストールして管理できる代物．
GoogleChrome やAtom ，VSCode などのGUIアプリケーションもインストールすることができる．

今回は，後述するVirtualbox とVagrant をインストールするためにHomebrew Cask を使用する．

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ brew tap cask room/cask # Homebrew caskをインストール
```

■ 覚えておきたいコマンド一覧

```Bash:ターミナル
$ brew cask install <パッケージ名> # インストール

$ brew cask uninstall <パッケージ名> # アンインストール

$ brew cask upgrade # インストール済みのパッケージを更新

$ brew cask upgrade <パッケージ名> # 指定したパッケージを更新

$ brew cask list # インストール済みのパッケージを一覧表示

$ brew cask search <キーワード> # パッケージを検索

$ brew cask cleanup # 古いバージョンのパッケージを削除
```

参考：[みんなhomebrew-caskって知ってるか？](https://qiita.com/ryurock/items/1432578d364985f6cb06)
参考：[Homebrew Cask を使うと macOS アプリをインストールするのが捗る](https://yu8mada.com/2018/04/20/using-homebrew-cask-makes-good-progress-with-installing-macos-apps/)


## Virtualboxのインストール

[Virtualbox](https://www.virtualbox.org)は，仮想環境を作成するためのソフトウェア．
ここで先ほどインストールしたHomebrew caskを使用する．


**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ brew cask install virtualbox # Virtualboxをインストール

$ brew cask list    # 確認
```

＊ Windowsの場合，[公式サイト](https://www.oracle.com/technetwork/jp/server-storage/virtualbox/overview/index.html)からダウンロードしてインストールする．


## Vagrantのインストール

[Vagrant](https://www.vagrantup.com)は，仮想環境の構築や共有を簡単に行うことができるツール．
Virtualbox と組み合わせることで，仮想環境の構築を非常に簡単に行うことができる．*マジ超便利．*
似たツールに[Docker](https://www.docker.com)というものがあるが，これまた難しいので，別の機会にまとめることにする．

**1. ターミナルで下記のコマンドを実行．**

```Bash:ターミナル
$ brew cask install vagrant # Vagrantをインストール

$ brew cask list    # 確認

$ vagrant -v    # 確認
```

＊ Windowsの場合，[公式サイト](https://www.vagrantup.com/downloads.html)からダウンロードしてインストールする．

## まとめ

以上で仮想環境を構築するツールの準備が完了．
次回から実際にVagrantで仮想マシンを作成していく．

今回：Vagrantで開発環境を構築（0.事前準備編）
次回：[Vagrantで開発環境を構築（1.仮想マシン作成編）](https://qiita.com/koukibuu3/items/1a0e13d016d758042da6)


目的

勉強の一貫で記事をまとめる．
パッケージ管理ツールの準備をする（Mac）．
仮想環境を構築するツールの準備をする．

今回：Vagrantで開発環境を構築（0.事前準備編）
次回：Vag