Express Generator で作成した Node ウェブアプリを Heroku で公開する手順

前回の続きです。

> Express Generator を使った Node.js + Express.js の環境構築手順
> https://qiita.com/tsuyoshioshima/items/7a553c25f222333b9503

##環境
- macOS HighSierra

##前提条件
- Homebrew が使えること
- gitコマンドが使えること

git コマンドが使えない場合は、以下を参照してください

> 購入直後のMacでGitコマンドを使えるようになるまで
> https://qiita.com/furusin_oriver/items/974a7b7fb8c56ad88d6e

## Heroku への登録

Heroku.com にアカウントを作成する。
なお、Heroku の登録手順は以下を参照してください。

> Heroku初心者がHello, Herokuをしてみる
> https://qiita.com/Arashi/items/b2f2e01259238235e187

なお、クレジットカードを登録しておくと、無料で利用できる時間が増えたり（750時間／月が1,000時間／月に増える）、Add-Ons を使う時に必要なので、登録しておくのが吉。
知らぬ間に勝手に課金されることもありません。


こちら（ https://devcenter.heroku.com/articles/heroku-cli ）を参考に Heroku Command Line Interface （旧 Heruku toolbelt）をインストールする

```
$ brew install heroku/brew/heroku
```

Heroku にログインを行い、登録したメールアドレスとパスワードを入力して認証が通ることを確認する。

```
$ heroku login
Email: hogehoge@piyopiyo.com
Password: ********
Logged in as hogehoge@piyopiyo.com
```

# git リポジトリへの登録

アプリのディレクトリに移動する

```
$ cd myapp
```

git リポジトリの初期化をする

```
$ git init
```

.gitignore ファイルを用意し、Heroku にデプロイ（配置）する必要のないファイルを登録する。

```
$touch .gitignore
```

とりあえず node_modules フォルダ配下は、package.json を元に Heroku 側で用意してくれるので、こちらからデプロイする必要はない。あとは必要に応じて。
具体的にどう記述すれば良いかは、こちらを参考にすると良い。

> https://github.com/github/gitignore/blob/master/Node.gitignore


あとは add して commit する。

```
$ git add .
$ git commit -m "first commit"
```

##Herokuへのデプロイ（配置）

Heroku側に新しいアプリケーションを作成する
アプリ名が空欄の場合は、Heroku側がランダムでユニークなアプリ名を付けてくれます。
アプリ名はあとで任意に変更可能なので、とりあえずブランクでOK。

```
$ heroku create <app_name>
Creating app... done, ⬢ xxxxx-xxxxx-12345
https://xxxxx-xxxxx-12345.herokuapp.com/ | https://git.heroku.com/xxxxx-xxxxx-12345.git
```

アプリをデプロイする

```
$ git push heroku master
〜省略〜
remote: Verifying deploy... done.
To https://git.heroku.com/xxxxx-xxxxx-12345.git
 * [new branch]      master -> master
```

ブラウザでアプリにアクセスして、デプロイできているか確認する。

```
$ heroku open
```

これで無事デプロイが完了。

##備考
- 「Procfile が必要」との情報もあるが、ない場合は Heroku 側で良きに計らってくれている模様
- 「Heroku の環境変数（process.env.PORT）からポート番号を取得するための修正が必要」との情報があるが、express-generator が ./bin/www 内にすでに記述してくれているので、express-generator を使用している場合は「process.env.PORT」などの修正は不要

##参考記事

Node.js開発者のためのHeroku入門
https://www.slideshare.net/DeveloperForceJapan/nodejsheroku

Node.js(Express) 事始め ＆ Heroku へデプロイまでのメモ
https://qiita.com/hkusu/items/e46de8c446840c50aefe

Node.jsのExpressで作ったサーバーをHerokuで動かす
https://qiita.com/awakia/items/26eae40afb1c9ad76161

##git push 時のログ

```
$ git push heroku master
Counting objects: 17, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (14/14), done.
Writing objects: 100% (17/17), 6.63 KiB | 2.21 MiB/s, done.
Total 17 (delta 1), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote: 
remote: -----> Node.js app detected
remote: 
remote: -----> Creating runtime environment
remote:        
remote:        NPM_CONFIG_LOGLEVEL=error
remote:        NPM_CONFIG_PRODUCTION=true
remote:        NODE_VERBOSE=false
remote:        NODE_ENV=production
remote:        NODE_MODULES_CACHE=true
remote: 
remote: -----> Installing binaries
remote:        engines.node (package.json):  unspecified
remote:        engines.npm (package.json):   unspecified (use default)
remote:        
remote:        Resolving node version 8.x...
remote:        Downloading and installing node 8.9.3...
remote:        Using default npm version: 5.5.1
remote: 
remote: -----> Restoring cache
remote:        Skipping cache restore (not-found)
remote: 
remote: -----> Building dependencies
remote:        Installing node modules (package.json + package-lock)
remote:        added 57 packages in 1.542s
remote: 
remote: -----> Caching build
remote:        Clearing previous node cache
remote:        Saving 2 cacheDirectories (default):
remote:        - node_modules
remote:        - bower_components (nothing to cache)
remote: 
remote: -----> Build succeeded!
remote: -----> Discovering process types
remote:        Procfile declares types     -> (none)
remote:        Default types for buildpack -> web
remote: 
remote: -----> Compressing...
remote:        Done: 17.8M
remote: -----> Launching...
remote:        Released v3
remote:        https://xxxxx-xxxxx-12345.herokuapp.com/ deployed to Heroku
remote: 
remote: Verifying deploy... done.
To https://git.heroku.com/xxxxx-xxxxx-12345.git
 * [new branch]      master -> master
```