【備忘録】Herokuでのデプロイの流れ

こんばんは、だいごです。
今回は、Herokuでのデプロイの流れを簡単にまとめていきます。
Herokuのコマンドがメインなので省力するところもあります。
よかったらみてください。

## 予備知識
- <b>デプロイ</b>
ネットワークを通じてWebアプリケーションなどのシステムを公開し、利用可能な状態にすること。

- <b>CLI</b>
コンピュータに対してキーボードからコマンドという文字を打ち込んで操作を行う仕組み。

- **credentials.yml.encファイル**
Railsにて、外部に漏らしたくない情報を扱う際に用いるファイル。
通常時は、英数字の文字列で構成された暗号文が表示され、ファイル内に何が書かれているのか分からない。
master.keyが存在する場合、ファイル内の記述を確認できる。

- **master.keyファイル**
credentials.yml.encファイルを復号する鍵の役割を持ったファイル。
特定のcredentials.yml.encファイルと対になっているので、その他のファイルでは効果を発揮しない。
また、重要なファイルであるため、デフォルトで<b>.gitignore</b>に記述されており、Gitで管理されない仕組みになっている。

- **環境変数**
様々なOSが動作している時に使用する変数。
特定の値を格納する箱のようなもので、外部に漏らしたくない情報をセットするイメージ。

## Herokuとは
アプリケーションの公開、運用を行うためのサーバーを提供するサービス。
デプロイする際には、Gitの仕組みを使用し、Gitで管理しているリポジトリをHerokuへ反映することで、Heroku上で該当するアプリケーションの操作が可能になる。
基本機能だけであれば無料で使用でき、デプロイの手間が少なく容易なのがメリット。

## デプロイの手順
- <b>初めてデプロイする時</b>
①Herokuにアカウント登録
②HerokuCLIをインストール
③masterブランチへcommit
④Heroku上にアプリケーションを作成
⑤MySQLを使用できるように設定
⑥master.keyを環境変数として設定
⑦Herokuへアプリケーションの情報をpush
⑧Heroku上でマイグレーションを実行

- <b>デプロイ済みのアプリを修正した時</b>
①変更修正をcommit
②ブランチを作成していた場合は、masterブランチへマージ
③Heroku上にpush
④（テーブルに変更を加えた場合は）Heroku上でマイグレーションを実行

## 初めてデプロイするときの処理
<b>①Herokuにアカウント登録</b>

Herokuのサインアップページにて、登録を行います。
リンクは以下に記します。
[Heroku](https://signup.heroku.com/login)

<b>②HerokuCLIをインストール</b>

ターミナルにて以下のコマンドを入力します。

```zsh:ターミナル
%　brew　tap　heroku/brew　&&　brew　install　heroku
```

インストール完了後、以下のコマンドにて完了確認を行います。

```zsh:ターミナル
%　heroku　--version

# 出力結果（バージョンは変わる場合がある)
heroku/7.60.1　darwin-x64　node-v14.19.0
```

上記のように、バージョンが出力されれば完了です。

**③masterブランチへcommit**

GitHubを用いて、commitします。
操作がわからない場合はこちらの記事を参考にしてください。
[GitHub Desktopの使い方](https://style.potepan.com/articles/31878.html)

**④Heroku上にアプリケーションを作成**

ここからはHeroku上でアプリを作成していきます。
まずは、①で登録したメールアドレスとパスワードを用いて、Herokuにログインします。
ターミナルにて以下のコマンドを入力します。

```zsh:ターミナル
# Herokuへログインするためのコマンド
%　heroku　login　--interactive

heroku:　Enter　your　login　credentials
Email:　メールアドレス
Password:　パスワード
Logged　in　as　メールアドレス
```

EmailとPasswordを入力し、上記のようになればログイン完了です。

次にデプロイの準備ができたので、Heroku上にアプリを作成していきます。
Heroku上でのアプリ作成には以下のコマンドを使用します。

- **heroku createコマンド**
Heroku上に公開するためのアプリを作成できる。
続けてアプリ名を記入することで、Heroku上でのアプリケーション名を決めることができる。
すでに登録されているアプリケーション名は使用できない。

ターミナルにてコマンドを使用します。

```zsh:ターミナル
%　heroku　create　アプリケーション名

# 出力結果
Creating app... done, ⬢ アプリケーション名
https://アプリケーション名.herokuapp.com/ | https://git.heroku.com/アプリケーション名.git
```

入力に成功すると、上記のように出力されます。
その後、以下のコマンドを入力し、正しく設定できているか確認を行います。

```zsh:ターミナル
% git config --list | grep heroku
```

fatal: not in a git directory以外の表示が出ればOKです。

**⑤MySQLを使用できるように設定**

ここでは、データベースの設定を行います。
Herokuでは、デフォルトでPostgreSQLというデータベースになっているため、変更していきます。
この変更の際に用いるのが、**ClearDBアドオン**です。

- **ClearDBアドオン**
MySQLを使うためのツール。
追加することにより、HerokuでMySQLを使用できるようになる。

ターミナルにて、追加していきます。

```zsh:ターミナル
% heroku addons:add cleardb

# 出力結果
Creating cleardb on ⬢ アプリケーション名... free
Created cleardb-vertical-00000 as CLEARDB_DATABASE_URL
Use heroku addons:docs cleardb to view documentation
```

上記のようになれば、追加完了です。
Ruby on Railsを使用する場合には、MySQLに対応するGemを考慮する必要があるので、その設定をしていきます。

```zsh:ターミナル
% heroku_cleardb=`heroku config:get CLEARDB_DATABASE_URL`
```

上記のコマンドで、変数にClearDBデータベースのURLを格納します。

```zsh:ターミナル
% heroku config:set DATABASE_URL=mysql2${heroku_cleardb:5}

# 出力結果
Setting DATABASE_URL and restarting ⬢ アプリケーション名... done, v◯◯
DATABASE_URL: mysql2://000000000000:0aa0000@us-cdbr-east-02.cleardb.com/heroku_aaa00000000?reconnect=true
```

これでURLの再設定が完了です。

**⑥master.keyを環境変数として設定**

ここからは、環境変数としてmaster.keyを設定していきます。
Herokuへの環境変数の設定には、以下のコマンドを使用します。

- **heroku config**
Heroku上で環境変数の参照・追加・削除等をする場合に用いるコマンド。
環境変数の追加であれば<b>heroku config:set 環境変数名="値"</b>と記述する。

Heroku上に環境変数を設定するコマンドを実行していきます。

```zsh:ターミナル
% heroku config:set RAILS_MASTER_KEY=`cat config/master.key`
```

正しく設定できているか確認する場合は、以下のコマンドを実行します。

```zsh:ターミナル
% heroku config
```

出力結果に、RAILS_MASTER_KEYという変数名で値が設定されていれば成功です。

**※動作環境の設定**

ここでは、動作環境の設定を行います。
デフォルトのStackのHeroku-20になっています。
自身が使用しているRubyのバージョンに合わせるためにStackのバージョンを変更していきます。

- **Stack**
Herokuにおけるアプリケーションの動作環境のこと。
デプロイされたアプリケーションを読み取り正常に稼働させるために用意されている。

コマンドを実行していきます。

```zsh:ターミナル
% heroku stack:set heroku-18 -a　アプリケーション名
```

**※Nodeのバージョンの指定**

ここでは、Nodeのバージョン指定を行います。
Herokuの初期設定では、version16になっています。
自身が使用しているRubyのバージョンに合わせるためにNodeのバージョンを変更していきます。
流れとしては、buildpackという機能の使用してpackage.json内の記述を変更し、使用するNodeのバージョンを指定するようになります。

- **buildpack**
デプロイされたコードをHeroku上で適切に扱うために用意された、スクリプトのパッケージ。
これがあることで様々な言語を扱うことができる。

node.jsとrubyのbuildpackをインストールしていきます。

```zsh:ターミナル
% heroku buildpacks:add heroku/nodejs
```
```zsh:ターミナル
% heroku buildpacks:add heroku/ruby
```

以下のコマンドでインストールができているか確認できます。

```zsh:ターミナル
​​% heroku buildpacks

# 自己結果
=== アプリ名 Buildpack URLs
1. heroku/nodejs
2. heroku/ruby
```

上記のようになればインストール完了です。
続いて、package.jsonの編集を行います。

```zsh:ターミナル
% node -v

# 出力結果
v14.19.1
```

上記のコマンドで確認したバージョンを記述していきます。

```json:package.json
{
  "name": "アプリ名,
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0-alpha",
    "@rails/activestorage": "^6.0.0-alpha",
    "@rails/ujs": "^6.0.0-alpha",
    "@rails/webpacker": "4.3.0",
    "turbolinks": "^5.2.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "webpack-dev-server": "^4.8.1"
  },
  "engines" : {
    "node": "14.19.1"  //バージョンを記述
  }
}
```

変更点をリモートリポジトリにコミット・プッシュで反映し、package.json内の記述の変更は完了です。

**⑦Herokuへアプリケーションの情報をpush**

ここでは、Gitで管理しているリポジトリをHerokuに反映していきます。
以下のコマンドを入力し、Heorkuにアプリの情報を追加します。

```zsh:ターミナル
% git push heroku master

# 出力結果
Enumerating objects: 11, done.
Counting objects: 100% (11/11), done.
Delta compression using up to 2 threads
Compressing objects: 100% (6/6), done.
Writing objects: 100% (6/6), 615 bytes | 615.00 KiB/s, done.
Total 6 (delta 5), reused 0 (delta 0), pack-reused 0
remote: Compressing source files... done.
remote: Building source:
remote: 

# 以下省略
```

上記のようになれば完了です。

**⑧Heroku上でマイグレーションを実行**

最後に、データベースにマイグレーションを反映していきます。
ここで使用するコマンドが**heroku runコマンド**です。

- **heroku runコマンド**
Heroku上で実行したいコマンドに用いる。
rails db:migrateであればheroku run rails db:migrateと実行する。

コマンドを入力していきます。

```zsh:ターミナル
% heroku run rails db:migrate

# 出力結果
Running rails db:migrate on ⬢ アプリケーション名... up, run.8920 (Free)
D, [2022-04-08T08:22:50.410454 #4] DEBUG -- :    (2.9ms)  SET NAMES utf8mb4,  @@SESSION.sql_mode = CONCAT(CONCAT(@@sql_mode, ',STRICT_ALL_TABLES'), ',NO_AUTO_VALUE_ON_ZERO'),  @@SESSION.sql_auto_is_null = 0, @@SESSION.wait_timeout = 2147483
D, [2022-04-08T08:22:50.467023 #4] DEBUG -- :    (2.6ms)  SELECT @@innodb_file_per_table = 1 AND @@innodb_file_format = 'Barracuda'

# 以下省略
```

上記のようになれば完了です。

**※公開の確認**

下記のコマンドを入力することでHerokuにデプロイされたアプリケーションの情報を確認できます。

```zsh：ターミナル
% heroku apps:info

# 出力結果
===アプリケーション名
Addons:         cleardb:ignite
Auto Cert Mgmt: false
Dynos:          web: 1
Git URL:        https://git.heroku.com/アプリケーション名.git
Owner:          test@test.com
Region:         us
Repo Size:      165 KB
Slug Size:      56 MB
Stack:          heroku-18
Web URL:        https:/アプリケーション名.herokuapp.com/
```

**※エラーログの確認**
エラーが出た時にはエラーログの確認を行います。
その際使用するコマンドは**heorku logsコマンド**です。

- **heroku logsコマンド**
Heroku上のアプリケーションが稼働したログを、表示するためのコマンド。
しかし、ログは非常に長いため、--tailオプションを使用することでログの最後の10行だけを表示することができる。

```zsh:ターミナル
% heroku logs --tail --app <<アプリケーション名>>
```

## デプロイ済みのアプリを修正したときの処理

記事の最初の方に書きましたが、流れとしてはこんな感じになります。

①変更修正をcommit
②ブランチを作成していた場合は、masterブランチへマージ
③Heroku上にpush
④（テーブルに変更を加えた場合は）Heroku上でマイグレーションを実行

③④に関しては、初めてデプロイするときの処理の⑦⑧と同様にすればOKです。

## 終わりに
書きたいことを書いたらめっちゃ長くなってしまいました。
間違いやご指摘あればコメントにお願いします。
ありがとうございました。