先日「torchlights」をDeployするにあたって、初めてHerokuを使ってみました。

p5.js + Node.js + Socket.io : アクセスしている人みんなでParticle動かすアプリ「torchlights」

p5.jsでなんかつくってみようということで、Node.js + Socket.ioと組み合わせてリアルタイムに同じアプリ内でオブジェクト操作で

その際にたどったHerokuへのDeploy手順をメモしておきたいと思います。基本的には、公式サイトの下記手順を踏めば簡単にDeployできます。Herokuアカウントは作成してある前提です。

Getting Started on Heroku | Heroku Dev Center

toolbeltのインストール

まず、herokuとやりとりをするための「toolbelt」というコマンドラインツールをインストールします。下記に各OS毎にインストール方法がありますが、ここではUbuntuを選択します。

Heroku Toolbelt

UbuntuはInstallerとかはなく、ただwgetでインストールスクリプトを取ってきて実行するだけです。

1

$ wget -qO- https://toolbelt.heroku.com/install-ubuntu.sh | sh

これで、herokuコマンドが使えるようになりました。さっそくログインしておきます。

1
2
3
4
5


$ heroku login
Enter your Heroku credentials.
Email:
Password (typing will be hidden):
Authentication successful.

自分のherokuのアカウントでログインすれば、完了です。

アプリケーションを作成する

heroku側にアプリケーションを作成します。今回はNode.jsを作成します。

まず、herokuにアクセスしてダッシュボードを開きます。右上の「＋」を選択して下記のようなフォームからアプリを作成します。

RegionはUSで問題ないです。

これでアプリケーションが作成されます。Deployの手順が表示されるので、それに従えばDeployが可能です。 herokuはDeployされたコードから自動でアプリケーションの種類を判別して環境を整えるようなので、ここでNode.jsであるという指定は必要ないです。

ちなみに、アプリケーションはheroku toolbeltから作成することもできます。

1
2
3


$ heroku create xxxx
Creating xxxx... done, stack is cedar-14
https://xxxx.herokuapp.com/ | git@heroku.com:xxxx.git

createコマンドにアプリ名を渡さない場合は自動的に適当な名前が割り振られます。

なお、herokuコマンドのヘルプは

1
2


$ heroku help
$ heroku help [command]

で参照できます。

Node.jsアプリの準備

Node.jsやExpressを使ったアプリの詳細は割愛して、ここではherokuへDeployする際に必要な設定などを行います。

最低限必要なのはpackage.jsonの編集だけです。dependenciesのチェックと、enginesの指定が必要です。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


{
  "name": "sample",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node app"
  },
  "engines": {
    "node": "0.10.32",
    "npm": "1.4.28"
  },
  "dependencies": {
    "body-parser": "~1.8.1",
    "cookie-parser": "~1.3.3",
    "debug": "~2.0.0",
    "ejs": "~0.8.5",
    "express": "~4.9.0",
    "morgan": "~1.3.0",
    "newrelic": "^1.13.3",
    "request": "^2.47.0",
    "serve-favicon": "~2.1.3",
    "socket.io": "^1.2.0"
  }
}

利用しているnodeとnpmのVersionを記載します。また依存しているモジュールの記載漏れがないか確認してください。開発中にnpm install xxx --saveとsaveオプションつきでインストールしておくと、自動的にpackage.jsonに追記されるので便利です。

はじめてのNode.js -サーバーサイドJavaScriptでWebアプリを開発する- Amazonで見る

foremanで動作確認する

Deploy前にローカル環境で動作確認をします。そのためにforemanという仕組みが提供されています。 foremanを実行するために、アプリケーションルートにProcfileを作成します。

1

web: node app.js

後は、foremanを実行し動作確認をします。

1

$ foreman start

Procfileについては、以下に説明があるので参考になります。

procfile · herokaijp/devcenter Wiki · GitHub

Procfileはherokuがアプリ実行に必要なファイルらしいですが、自作しないで打ち上げるとサーバ側では自動で作成されるようです。

herokuのリモートリポジトリにpushする（デプロイ）

最後にDeployをします。heroku側へはGitを使って打ち上げます。 heroku側にGitのリモートリポジトリがあるので、それをローカルに登録してプッシュします。

既にGitリポジトリがあれば、そこにリモートリポジトリを登録するだけです。

1

$ heroku git:remote -a [application name]

すると、herokuという名前で登録されるので、そこを指定してpushします。

1

$ git push heroku master

実行すると、Pushされるだけではなく自動的にアプリ起動に必要な環境を作成し始め、アプリがサーバ側で起動します。

1
2
3


$ heroku ps
$ heroku open
$ heroku logs

これでプロセスの確認、アプリをブラウザで開く、アプリのログをみることができます。

まとめ

初めてPaaSへを使ってアプリのホストをしてみましたが、Herokuは人気のサービスなだけあってかDeployまでが非常に簡単で使いやすい印象でした。

またDynoが1つまでであれば、無料で使えるところも魅力だと思います。ただしDynoが1つのときは1時間アクセスがないと、勝手にアプリが停止します。herokuとしては2 Dynos以上を推奨しています。

無料で利用し続けるために、アプリに対して定期的なHTTP GETを発行する方法がよく取られていますが、それはまた別途書きたいと思います。

プロフェッショナルのための実践Heroku入門プラットフォーム・クラウドを活用したアプリケーション開発と運用 (書籍) Amazonで見る

Release It! 本番用ソフトウェア製品の設計とデプロイのために Amazonで見る