ExpressからHeroku Postgresを使う

# はじめに
HerokuでHeroku Postgresを使うアプリケーションを初めて公開する際に色々と手間取ったので、本記事に一連の流れをまとめる。
なお、アプリケーションの作成にはExpressを用いた。

## 環境変数を使う
環境変数を使うことで、ソースコードにべた書きしたくない情報（DB接続情報やAPIキーなど）を隠すことができる。

## 前提・環境
* Heroku CLIインストール済み
* Herokuに該当プロジェクトをあげてある
* windows 10
* node 10.15.3
* heroku 7.26.2

## Heroku Postgresの準備
### Heroku上のアプリにHeroku Postgresを導入
1. 「Resources > Find more add-ons > Heroku Postgres」の順に移動。
2. 「Install Heroku Postgres」でインストール。
3. 「Hobby Dev」という無料プランを選択。
4. Heroku Postgresを導入するアプリケーションを選択し、「Provision addo-ons」をクリック。
5. 導入完了

### Heroku Postgresへの接続

```:command
heroku pg:psql -a [Heroku上のアプリ名]
```

### データ用意
基本的なSQL文の書き方は割愛。

テーブル作成

```:command
CREATE TABLE Rank(
id SERIAL,
hands INTEGER NOT NULL,
name VARCHAR(10) NOT NULL,
level INTEGER NOT NULL,
PRIMARY KEY(id)
);
```

ダミーレコード挿入

```:command
INSERT INTO Rank (hands, name, level) VALUES (10, 'taro', 2);
```

## Heroku Postgresの環境変数設定
### 接続情報入手
メニューから、「DATA > アプリ名 > Settings > （Database Credentialsの）View Credentials」の順に移動。
``Host, Database, User, Port, Password``などの情報が入手できる。
注意点として、これらの情報をソースコードにべた書きしてGitHub上に上げる、などということは絶対にしないように！！
（この情報使えば、誰でもデータベースいじれてしまうので…）

### 環境変数設定

```:command
$ heroku config:set [任意のKEY]=[環境変数を指定] --app [アプリ名を指定]

# 例えば、HOST情報を環境変数に設定したい場合
$ heroku config:set ENV_HOST=xxxxxxxxxxxxxxxx --app SAMPLEAPP
```

上記のようにして、``Host, Database, User, Port, Password``を環境変数に設定すれば、基本的にデータベース接続に必要な情報は十分。
もちろん、``ENV_HOST``などのKEYは自由に命名して問題ない。

### 設定できたかの確認・削除

```:command
# 環境変数一覧の取得
$ heroku config:get -a [アプリ名]

# 特定の環境変数の取得
$ heroku config:get [KEY] -a [アプリ名]

# 環境変数の削除
$ heroku config:unset [KEY] -a [アプリ名]
```

## 環境変数を使う
例えば、Expressアプリの場合は下記のようにして扱う。

``node-dotenv``をインストール

```:command
npm install --save dotenv
```

``process.env.KEY``とすることで、Herokuで設定した環境変数を使えるようになる。

```javascript:db/db.js
const pg = require('pg');
require('dotenv').config();

exports.pool = pg.Pool ({
  host: process.env.ENV_HOST,
  database: process.env.ENV_DB,
  user: process.env.ENV_USER,
  port: 5432,
  password: process.env.ENV_PASSWORD,
});
```

一応接続できるか確認する簡単なサンプルコードも以下に。
※express-generatorで作成したアプリに手を加えています。

```javascript:route/index.js
const express = require('express');
const router = express.Router();

const db = require('../db/index');

router.get('/', (req, res, next) => {
  db.pool.connect((err, client) => {
    if (err) {
      console.log(err);
    } else {
      client.query('SELECT name, hands FROM rank', (err, result) => {
        console.log(result.rows);
      });
    }
  });
  res.render('index', {
    title: 'hello express',
  });
});
```

ちなみに、``.env``ファイルをプロジェクト直下に用意することで、ローカルではローカルのPostgreSQLを参照することができる。

```:.env
ENV_HOST = localhost
ENV_DB = [ローカルの任意のdb名]
ENV_USER = postgres
ENV_PASSWORD = [ローカルのpostgresのパスワード]
```

``.env``ファイルの内容はgitに上げてはいけないので、``.gitignore``ファイルに下記の記述も忘れずに。

```:.gitignore
.env
```

## おわりに
本記事ではは、Node.jsのフレームワークExpressで作ったアプリケーションにHeroku Postgresを導入する方法をまとめた。
また、サンプルコードは、筆者が作ったアプリから抜粋してきたものなので、そのままコピペしてもうまくいかない可能性があるのでご注意を。
間違いなどあれば、コメントにお願いします。

## 参考文献
* 環境変数をNode.jsで利用する方法、node-dotenvを使う
    * https://www.npmjs.com/package/dotenv
    * https://daiki-sekiguchi.com/2018/08/29/nodejs-dotenv/
    * https://qiita.com/ueokande/items/80048f886082fea5b776
* herokuコマンド、環境変数まわり
    * https://qiita.com/chihiro/items/b8a3ef54716842dd115a