LoginSignup
61
55

More than 5 years have passed since last update.

Heroku:(Application Errorにならないための)Node.jsアプリのデプロイ入門

Last updated at Posted at 2016-02-15

Node.jsで作成したWebアプリ(Git管理)のデプロイ方法です。
個人的にハマったApplication Errorについても記載しています。

 "node"   : "v4.1.1",
 "npm"    : "2.14.4",
 "express": "^4.13.4"

ローカル準備編

Procfileを作成

アプリの起動コマンドを記述します。
アプリの第一階層に設置します。

web: node server.js

package.json/"dependencies"に使用しているパッケージを全て記述。

server側で使用しているパッケージを記述します。
ひとつでも抜けていると"Application Error"になるので注意してください。

package.json
"dependencies": {
    "body-parser": "^1.14.2",
    "express": "^4.13.4",
    "request": "2.61.0"
  }

cf. "dependencies"の説明

もしApplication Errorが出る場合は
使用しているパッケージが記述されているか確認してみてください。
僕の場合はグローバルインストールしていたパッケージが
抜けていたためにハマりました。

ポート番号の記述を変更

server.js
app.listen(8000);

↓↓↓

server.js
app.listen(process.env.PORT || 8000);

これはかなりハマりました。。。
Herokuでは明示的にポート番号を指定する必要があります。

.gitignoreを追加

既にGitHubにpushしていたら設置済みかもしれませんが
node_modulesを除外する設定を記述します。

node_modules/

package.jsonに"engines"を追加、

アプリを堅牢にするため
versionの末尾を"X"にしておくと良いそうです。

package.json
"engines": {
    "node": "v4.1.X",
    "npm": "2.14.X"
  }

cf."engines"の説明

Herokuにデプロイ編

HerokuへSignUpしてアプリを追加します。

こちらが詳しいです。
今からはじめるReact.js〜Herokuへのデプロイ〜

HerokuのDashboardから
追加したアプリのDeployページへ移動すると
デプロイ方法が書いてありますのでそれに従いましょう。

heroku_deploy.jpg

heroku toolbeldのインストール

Herokuコマンドが使えるようになります。
https://toolbelt.heroku.com/

Herokuへログインします。

$ heroku login

リモートリポジトリにHerokuアプリを追加します

$ cd [my-project]/
$ git init //既にgitをinitializeしている場合は不要
$ heroku git:remote -a [my-app-name]

gitにcommitし、Herokuにpushしてデプロイ完了です!

$ git add .
$ git commit -am "make it better"
$ git push heroku master

無事デプロイに成功すると

remote: Verifying deploy.... done.
To https://git.heroku.com/[my-app-name].git
   xxxxxxx..xxxxxx  master -> master

と表示されるはずです。
おつかれさまでした!


▼ちなみにもういったん消しちゃうときはコチラ

git remote remove heroku


参考リンク

Node.js + Express を Heroku で動かすまでの手順まとめ
今からはじめるReact.js〜Herokuへのデプロイ〜
Express4 + mongoDBアプリケーションをherokuで動かす
Node.jsをHerokuへデプロイ
Node.jsのアプリをHerokuにデプロイするときポート番号に気をつけなくちゃいけない
Heroku + node.js error (Web process failed to bind to $PORT within 60 seconds of launch)

61
55
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
61
55