Node.js+Expressアプリケーションをherokuへdeployする。

Node.js,Express環境でAurelia.jsを動かしてみる--その6

Node.js,Express環境でAurelia.jsを動かしてみる--その1

Node.js,Express環境でAurelia.jsを動かしてみる--その2

Node.js,Express環境でAurelia.jsを動かしてみる--その3

Node.js,Express環境でAurelia.jsを動かしてみる--その4

Node.js,Express環境でAurelia.jsを動かしてみる--その5

無料のクラウドアプリケーションプラットフォームとして今回はherokuを使ってみます。

heroku-toolbeltのインストール

⇒ダウンロードhttps://toolbelt.heroku.com/

herokuのクライアントツールのheroku-toolbeltを上記サイトからダウンロードしてインストールします。command prompt上でherokuのさまざまなコマンドが使用可能になります。

※gitはheroku-toolbeltに内包されていたと思うのですが定かではないので動かなければインストールが必要です。

Procfileの準備

herokuサーバの実行ファイルを定義するProcfile（拡張子なし）を作成します。ルートフォルダに設置してください。今回はexpressの起動ファイルを実行します。

web: node app.js

.gitignore設定

bundleされたファイル等、実行ファイルのみをdeploy出来るように設定します。

jspmはサーバ側でも実行できますが今回は中身を全部bundleしてしまっているのでサーバでは処理しないようにしました。

そのためjspm_packagesに存在するsystem.js関連ファイルをcoreフォルダを作成しそちらにコピーしました。

またindex.html内のsystem.jsへのファイルパスを変更しています。

git管理から無視するフォルダ・ファイルを設定する.gitignoreファイルを作成します。

# ignore
/*
# not ignore
!/core
!/dist
!/routes
!/styles
!/views
!/.gitignore
!/.npmignore
!/app.js
!/config.js
!/favicon.ico
!/package.json
!/Procfile

ignoreするファイルが多かったので全部まるっと無視してから、無視を解除しています。

herokuへファイルをdeployする

git初期化

command promptを起動して今回作成したAurelia.jsのフォルダに移動します。

cd C:\project\aurelia-test

git init

herokuへログインする

heroku login

herokuで登録したE-mailとパスワードでログインします。

ローカルでの動作確認

heroku local web

herokuアプリケーションの作成

空っぽのアプリケーションを作成します。commandからでなくherokuホームページからでもできます。

heroku create myappname

gitの確認

gitのリモート設定がherokuのアプリケーションに接続されているか確認します。

git remote -v

heroku  https://git.heroku.com/myappname.git (fetch)
heroku  https://git.heroku.com/myappname.git (push)

接続がされていない場合は下記を実行してgitのリモートを設定します。

heroku git:remote -a myappname

gitでファイルをpushする

ファイルをherokuへpushします。これでdeployは完了になります。

git add .
git commit -m "my first commit"
git push heroku master

インデックスされているファイルをコミットします。-mでコメントを記述しています。-mでコメントを記載しないとテキストエディタが立ち上がりコメントを要求されます。

package.jsonを元にherokuでbuildが行われます。

dependenciesに記載されたパッケージがインストールされます。

下記にアクセスすることで確認できます。herokuホームページからも自分のアプリを確認したり設定を変更したりできます。

https://myappname.herokuapp.com/

※gulp bundleでバンドルされてないファイルを動かしたい場合は.gitignoreの設定を変えてください。今回紹介したignoreファイルはbundleされたファイルのみを扱う場合です。