ConoHaのVPS（安い！）とGitLab（無料）で、簡単なWeb環境にオートデプロイを構築してみる

# この記事のゴール
[GitLab](https://gitlab.com/)でmasterにマージしたときに[ConoHaのVPS](https://www.conoha.jp/referral/?token=is2CBwNpSpuLKlsExgfT1p0ofZJuBlWOXSvsumcdw8if1z8dMV0-N0Q)に自動でデプロイされるようにする。
インフラ初心者の方にも簡単にできるように、できるだけコピペでできるようにする。
ただし、登録系は自分でやってね。


# 利用するサービス
- [GitLab](https://gitlab.com/)
    - 無料
    - GitHubの代わり
    - 無料でプライベートリポジトリが作れる
    - GitHubより動作が遅い
- [ConoHaのVPS](https://www.conoha.jp/referral/?token=is2CBwNpSpuLKlsExgfT1p0ofZJuBlWOXSvsumcdw8if1z8dMV0-N0Q)
    - 安い仮想Webサーバ（最安で、月々630円しかかからない！AWSと違って固定料金なので安心！）
    - 速度いい感じ
    - 使いやすい
    - かわいい
    - 萌
    - ![fanfic_22.png](https://qiita-image-store.s3.amazonaws.com/0/63338/146b225e-7f79-ee59-1d62-0d5ec90625cd.png)


# サーバの準備

## サーバを立てる
[ConoHaのVPS](https://www.conoha.jp/referral/?token=is2CBwNpSpuLKlsExgfT1p0ofZJuBlWOXSvsumcdw8if1z8dMV0-N0Q)に行く。

↓

ダッシュボードにログインし、サーバを選択していく。
今回は一番安いプラン+CentOS7で作ります。

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/63029081-3069-bcdd-46fd-7be28edb71dc.jpeg)

↓

ネームタグとかパスワードを設定。
ネームタグはただの識別用の名前なので、好きな名前をつけます。
パスワードは、パスワードです。

![b.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/b086e2c3-baff-ac87-b536-b694203738c8.jpeg)

これでサーバが立ち上がりました。


## サーバにログインする
先程の続きです。
サーバリストに今回のサーバが追加されているので、詳細に進みます。

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/91f3c700-c202-32f2-6d84-d553cfcd1962.jpeg)

↓

サーバの接続先IPを取得します。

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/e7308847-ce76-a3f5-d37b-aa4d172ecc5b.jpeg)

↓

Windowsの場合は、Windows Subsystem for Linux（WSL。旧「Bash On Windows」）、
Macの場合はTerminalを起動し、

```bash
ssh root@さっき取得したIP
```

を実行。

```
Are you sure you want to continue connecting (yes/no)?
```

と聞かれるので、`yes`をタイプし、Enter。
次にパスワードを聞かれるので、先程設定したパスワードを入力しEnter。

うまくいくと、以下のようにログイン後の画面が表示されます。

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/f515529d-9e66-192e-cdf5-d192242fd5df.jpeg)



## Webサーバの準備

サクサク進めていきましょう。

### システムを最新に

```bash
sudo yum update -y
```


### タイムゾーンを日本に

#### 現在のサーバの時間を見てみる

```bash
date
```


#### 時間をJSTに

```bash
sudo ln -sf /usr/share/zoneinfo/Asia/Tokyo /etc/localtime
```


#### 確認

```bash
date
```


### 言語設定

UTF8で日本語に

```bash
echo "LANG=ja_JP.UTF-8" | sudo tee /etc/sysconfig/i18n
```


### sshログイン時のメッセージを変える

`sudo vim /etc/motd`と`sudo vim /etc/update-motd.d/30-banner`を編集する。
するとSSHログイン後にメッセージが表示される。


### git環境

```bash
sudo yum install -y git
```

### etckeeper

```bash
# epelリポジトリを有効化
sudo rpm -ivh https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm

# etckeeperのインスコ
sudo yum install -y etckeeper --enablerepo=epel

# etcフォルダ配下をgit管理
sudo etckeeper init

# 初期状態をコミット
sudo etckeeper commit "Initialize"

# ログ確認（qキーで抜けれます）
sudo etckeeper vcs log -p
```


### Apacheを入れる

```bash
sudo yum install -y httpd
```

確認

```bash
apachectl -v
# Server version: Apache/2.4.6 (CentOS)
# Server built:   Jun 27 2018 13:48:59
```

### PHPを入れる

```bash
sudo yum install http://rpms.famillecollet.com/enterprise/remi-release-7.rpm
sudo yum-config-manager --enable remi-php72
sudo yum install php php-fpm
```

確認

```
php -v
# PHP 7.2.12 (cli) (built: Nov  6 2018 16:40:25) ( NTS )
# ↑2018/11/25現在
```


### Webサーバとして公開する場所の作成

```
sudo mkdir -p /var/www/html
```


### テストでなんか作ってみる

```
cd /var/www/html/
sudo vim index.php
```

↓

Vimが立ち上がるので`i`を押し、とりあえずこんな感じで入力し、

```
<?php
phpinfo();
```

Esc → `:wq`　とタイプ。


### Apacheの設定

```
sudo vim /etc/httpd/conf.d/v-host.conf
```

を実行し、以下の情報を追加

```
<Directory />
    Require all granted
    AllowOverride All
    Options -Indexes
</Directory>


<VirtualHost *:80>
    ServerAdmin 自分のメアド
    DocumentRoot /var/www/html/

    <Directory "/var/www/html/">
        AllowOverride All
    </Directory>
</VirtualHost>
```




### Apacheの起動

```
sudo apachectl start
```


### php-fpmのスタート

```
sudo systemctl start php-fpm
```


### とりあえずFirewallを切る

```
sudo systemctl stop firewalld
```


### URLにアクセス

http://取得したIPアドレス/

↓

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/57762097-fac7-a8dd-86a3-0b50161e9f5a.jpeg)

いい感じ。



## GitLabの準備

登録は頑張って。

### GitLab Runnerをサーバにインストール

[このページ](https://docs.gitlab.com/runner/install/linux-manually.html)に書かれているコマンドを実行していきます。

```
cd ~/

sudo wget -O /usr/local/bin/gitlab-runner https://gitlab-runner-downloads.s3.amazonaws.com/latest/binaries/gitlab-runner-linux-amd64

sudo chmod +x /usr/local/bin/gitlab-runner

sudo useradd --comment 'GitLab Runner' --create-home gitlab-runner --shell /bin/bash

gitlab-runner install --user=gitlab-runner --working-directory=/home/gitlab-runner

gitlab-runner start
```



### GitLab RunnerにHook情報を登録

まず、トークンの確認をGitLab上で行います。

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/0fb2e0f8-c98a-7ad0-71eb-3707a903f98b.jpeg)

↓

![b.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/009b21e4-94e5-7301-8dcc-a1ad356fd124.jpeg)

---

次に登録を開始します。


```
gitlab-runner register
```

↑コレを実行すると対話型のやり取りが始まります。


#### 最初の問

```
Please enter the gitlab-ci coordinator URL (e.g. https://gitlab.com/):
```

↓

`https://gitlab.com/`を入力してEnter

#### 次の問

```
Please enter the gitlab-ci token for this runner:
```

さっき確認したトークンを入力してEnter



#### 次の問

```
Please enter the gitlab-ci description for this runner:
```

好きな説明
例：`for test`



### 


#### 次の問

```
Please enter the gitlab-ci tags for this runner (comma separated):
```

認識用のタグ（後で使うので適当に決めると後悔する）
例：`testdeploy`


#### 次の問

```
Please enter the executor: docker-ssh, shell, virtualbox, docker+machine, docker-ssh+machine, docker, parallels, ssh, kubernetes:
```

`shell`

これで終わるかと！




#### .gitlab-ci.ymlを作る

`.gitlab-ci.yml`ファイルをGitLabリポジトリの一番上の階層に置きます。
（.gitフォルダと一緒の階層）

![image.png](https://qiita-image-store.s3.amazonaws.com/0/63338/fe9a2474-ed32-d33c-19a2-ccf6f0fd12cb.png)


中身はこんな感じ

```
stages:
- master

deploy:
  stage: master
  script:
  - echo "hello!"
  tags:
  - さっき設定したタグ（例：testdeploy）
```

GitLabにPush


↓

設定が正常に反映されていると、
GitLab上に先程設定した内容が表示されていると思います。

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/7ed574a5-0620-4bb3-69d2-5432020f91b3.jpeg)

↓

![a.jpg](https://qiita-image-store.s3.amazonaws.com/0/63338/11dedf0c-193e-05ae-2047-f8bd64864b02.jpeg)


コレで準備は完了です！



## GitLab CIを使ってmasterにPush（またはmerge）時にデプロイする

AWSのCode Deployのように、GitLab CIはいい感じにごにょごにょはしてくれません。
全部書かなければいけないのが、良いところでもあり悪いところでもありますね！

でもまあ、仕組みを知らずに楽するより全然いいのでやっていきましょう。

その前に、GitLabにSSHキーを登録しておいてください。
鍵の作成は`gitlab-runner`ユーザで行います。（`sudo su gitlab-runner`を実行してから作る）
参考：[SSH認証キーをGitLabに登録・設定手順 覚書](https://qiita.com/redamoon/items/07e445d1fce360cb5fa3)

---

Hook時のブランチ名が`$CI_COMMIT_REF_NAME`という変数に格納されることを利用します。

`.gitlab-ci.yml`ファイルを以下のように書き直します。

```
stages:
- master

deploy:
  stage: master
  script:
  - if [ $CI_COMMIT_REF_NAME = 'master' ]; then
  - rm -Rf ~/testdeploy/
  - mkdir ~/testdeploy/
  - cd ~/testdeploy/
  - rm -Rf repository/
  - rm -Rf site/
  - mkdir repository
  - mkdir site
  - git clone --mirror git@gitlab.com:GitLabのURL ./repository
  - cd ./repository
  - git --work-tree=../site/ checkout -f master
  - cd ../site/
  - rsync -rlOzv --delete --checksum ./ /var/www/html/
  - cd /var/www/html/
  - else
  - echo 'master以外なので何もしない'
  - fi
  tags:
  - testdeploy
```

何やってるか……ちょっと複雑ではありますが、
GitLabからリポジトリをクローンし、変更があるファイルを全て更新していく……というbashの内容になってます。


---

`/var/www/html`フォルダをgitlab-runner権限にする。

```
sudo chown gitlab-runner:gitlab-runner -R /var/www/html/
```


---

先に、鍵認証を通しておきます（known_hostにGitLabを登録しとく）


```
sudo su gitlab-runner

git clone git@gitlab.com:GitLabのURL

# 鍵を登録するか？と聞かれるので、yesと答える。
```


---

ついでにわかりやすいようにindex.phpも変更します

```
hello test!
```

---

いざ、Push！！

↓

自動デプロイ成功！！！！（index.phpの内容が変わった！）

![image.png](https://qiita-image-store.s3.amazonaws.com/0/63338/a3a572a8-424f-305f-42c8-3efa57f2ad1e.png)