Heroku上にNode.jsのアプリケーションをDeployする備忘録

---

Heroku上にNode.jsのアプリケーションをDeployする簡易手順の覚書。
自分用の備忘録の色が強いです。

---

---

前提条件

git CLIがインストールされてること
https://git-scm.com/book/ja/v2/%E4%BD%BF%E3%81%84%E5%A7%8B%E3%82%81%E3%82%8B-Git%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB

heroku CLIがインストールされてること
https://devcenter.heroku.com/articles/heroku-cli

Node.jsがインストールされてること
https://nodejs.org/ja/download/

(1)herokuでアプリケーションを作る

heroku loginする

heroku login  
heroku: Press any key to open up the browser to login or q to exit:  
Opening browser to https://cli-auth.heroku.com/auth/browser/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx  
Logging in... done  
Logged in as [user name]  

heroku loginって打つと↑の2行目のメッセージが出るので未入力でEnter押す。
そうするとブラウザでHerokuのログイン画面が出るので、ログイン。
ログインするとCLIに戻ってきて4行目に「こいつでログインしました」という情報が出てくる。

heroku createでアプリつくる

heroku create [application-name]  
Creating ⬢ [application-name]... done  
https://[application-name].herokuapp.com/ | https://git.heroku.com/[application-name].git  

Herokuの画面上でも出来る。

application-nameはherokuのURLの一部になる。
なので誰かが使用済みの名前は使えない。
文字で始まってなければならず（数字や記号を一文字目に持ってこれない）、最低3文字以上指定が必要。
使えるのは文字、数字、ハイフンのみ。

これで作成完了するとhttps://[application-name].herokuapp.com/というURLが出来上がってる。
何もdeployしてない状態なので、Herokuの用意したデフォルトの初期ページが表示される。

(2)リポジトリをつくる

application-nameのディレクトリを作って中に移動する

cd [application-name]  

git initする

git init  

herokuと繋げる

heroku git:remote -a [application-name]  

この項(2)はHerokuのアプリケーションDeployページに全部載っている。

(3)Node.jsで適当になんかつくる

Node.jsで適当になんかつくる。

まずnpm initする。

npm init  

この際、指定するpackage nameは作成したapplication nameと同じにしておく。

とりあえず適当になんかつくる。
簡単に以下のようなコードにしておく。

const express = require('express');  
const app = express();  
const port = process.env.PORT || 4000;  
app.get(’/’,(req,res)=>{

res.send(‘get / request received’);

});
app.listen(port , ()=>{

console.log(‘server listened by port ’ + String(port) + ’ …’);

});

赤太字の部分が重要で、ローカルで動かす分には空いてるポートを適当に決め打ちで（ハードコーディングして）も良いのだが、herokuの場合、起動するポートをprocess.env.PORTという環境変数値から呼び出すようで、この記述をしていないとHeroku上でアプリケーションが起動しない。
実際に起動するのはHeroku上で空いてるポートになるようで、deployの度に毎回変わる。

expressを使ってるのでnpm installする。

npm install --save express  

赤太字の部分がやはり重要で、これを指定してpackage.jsonのdependenciesに記録しないとheroku上で動いてくれない。
これはexpressに限らず、他にnpmで持ってきた各種のパッケージがある場合は、herokuに渡す前にそれらを全てpackage.jsonに書いておく必要がある。

とりあえずローカルで動くか確かめてみる。

node index.js  

動くの確認できたらpackage.jsonに以下赤太字の記述を追加する。

{  
  "name": "[application-name]",  
  "version": "1.0.0",  
  "description": "",  
  "main": "index.js",  
  "scripts": {  
    "test": "echo \"Error: no test specified\" && exit 1"  
    ,"start" : "node index.js"  
  },  
  "author": "me",  
  "license": "ISC",  
  "dependencies": {  
    "express": "^4.17.1"  
  }  
}  

Herokuはpackage.jsonのscripts.startという要素に記述されたコマンドでアプリケーションを実行しようとする。
逆に言うとこの記述がないとheroku上でアプリケーションが起動できない。

(4)herokuにdeploy

git addする

git add .  

git commitする

git commit -m "first commit"  

git pushする

git push heroku master  

この後標準出力にべらべらと出てくるが、herokuのgitにpushすれば、後はherokuが勝手にdeployまでしてくれる。
簡単！
以後も何らかの変更を行ったと、(4)の一連の手順を踏めばherokuまで反映される。
実行完了したらhttps://[application-name].herokuapp.com/にアクセスして、反映されているか見る。
なお、無料枠だと、60分アクセスしないとsleep状態になり、次のアクセスでプロセスの起動から走るので、遅くなる。

---

COMMENT:
AUTHOR: 名無し
お世話になります。

点数とクチコミで探せるランキングサイト「ブロガイド」運営チームです。

https://bloguide.net/

従来のアクセス数という「数」ではない、読み手のレビューという「質」によって、ブログの本当の価値を見える化する、という目的で「ブロガイド」を立ち上げました。

この度、あなた様のブログを当サイトに掲載させていただくため、ご連絡した次第です。　　　

/

掲載に問題があれば、削除させていただきますので、ご連絡ください。

ブログ文化を盛り上げていきたいと考えておりますので、よろしくお願いします。

ブロガイド運営チーム

---