素人でもできるWindowsでのNemの開発！！エラーとかけっこうでたけど頑張った！その２ ～Node.jsをサーバに公開してサービスを提供する方法～

NEM

こんにちは！病み病みサラリーマンです。

前回に続いて、WindowsでNEMのアプリ開発に書きます。
前回はローカル環境でNEMのアプリケーションを動かすところを記載しましたが、ローカル環境で動かすことができたら、ホームページみたいに一般に公開したいと思うようになると思います。
でも、単純なHTMLじゃないし、Node.jsで作成したアプリを一般公開できるのかは気になるところだと思います。
結論から言うとできます。しかも無料で！！！

なんで、今回は簡単はNode.jsアプリを一般公開するとこまでを記載します。

１．公開するための簡単なNode.jsアプリケーションを作成する

まず、作成するアプリケーションはめっちゃ簡単なアプリケーションにします。
URLを実行すると「Hello World」と表示されるだけのアプリケーションです。
ソースは下記のような感じです。

var http = require('http');//①｢http｣関連の必要なオブジェクトの作成
var server = http.createServer();//②httpオブジェクトからserverオブジェクトの作成
server.on('request', doRequest);//③指定のイベント処理を組込む。第一引数にイベント名、第二引数に組込む処理（関数）を記載
server.listen(1234);
//server.listen(process.env.PORT, process.env.IP);//④serverを待受け状態にして、クライアントからリクエストがあった場合に処理をする状態にする。第一引数はポート、第二引数はホスト名(IP)
console.log('Server running!');
// リクエストの処理
function doRequest(req, res) {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    res.write('Hello World\n');
    res.end();
}

上記ソースを適当なファイル名で適当なフォルダに配置して、実行してみましょう。
私の場合は下記のフォルダに配置してます。
C:\Users\XXX\Desktop\nem-library-sample\node-sample\sampleapp.js

上記フォルダに移動して、コマンドプロンプトから下記コマンドでアプリケーションを実行してみます。

node sampleapp.js

コマンドプロンプトに「Server running!」と表示されたら成功です。
次に、ブラウザから下記URLを実行してください。ローカルで作成したアプリケーションが実行され、ブラウザに「Hello World」と表示されたら成功です。
http://localhost:1234/

ここまでできたら、このローカルで動かしたアプリケーションを一般公開させるために、Herokuというサービスへデプロイ（プログラムの配置）を行います。

２．Herokuへの登録

上記で作成したアプリケーションを実行してくれる一般公開されているサーバにこのモジュールをデプロイ、つまりプログラムの配置を行う必要があります。

ホームページを作成したことがある人ならレンタルサーバにHTMLファイルを配置するのと同じというとイメージがつきやすいかもしれないです。
HTMLの場合は、レンタルサーバでよいですがNode.jsの場合は、Node.jsを実行してくれるサービスへ配置を行う必要があります。

このNode.jsを実行してくれるサービスの１つがHerokuです。海外のサイトですが、多数の日本語の記事もあり、かつ登録や利用方法も簡単なので
使いやすいです。

では、早速登録してみましょう。
下記URLからHEROKUの公式サイトに移動します。
id.heroku.com

まず、トップページからSign Upをクリックします。

下記を参考に登録します。名前は自分の名前を入力してください。

登録すると、登録したメールアドレスにメールが届くので、そこからパスワード設定をしてください。

パスワード設定が完了したら、下記画面が表示されますので、下記をクリックしてください。

下記をクリックして、アプリ作成画面に遷移します。

アプリ名を入力して、準備完了です。

これでHerokuへの登録は完了です。

３．Heroku Toolbeltのインストール

次に、ツールのインストールです。
Herokuに登録する際のgit関係のツール等がインストールされます。

Windowsのインストールなので、下記をクリックして（私のPCの場合は64bitですが、OSに合わせて適宜32bitか64bitを選択してください）、あとはデフォルト設定で進めばインストール完了です。

４．Heroku登録に必要な設定ファイル作成（package.jsonとProcfile）

Herokuの登録には下記の2ファイルが必要です。
package.json　…　アプリケーションに必要な情報が記載してあるファイル
Procfile　…Herokuで実行するコマンドが書いてあるファイル

ちなみに、package.jsonはnpm installとコマンドプロンプトで実行すると、必要情報を聞かれるので入力すればできあがります。
直接、ファイルを記載してももちろんOKです。

package.jsonファイルは下記な感じ

{
  "name": "sampleapp-bakeneko",
  "version": "1.0.0",
  "description": "display Hello world!!",
  "main": "sampleapp.js",
  "scripts": {
    "start": "node sampleapp.js"
  },
  "engines": {
    "node": "6.2.2"
  },
  "author": "bakeneko",
  "license": "ISC"
}

Procfileファイルは下記な感じ

web: node sampleapp.js

５．gitを使ってHerokuへのアプリのデプロイ

ついに、Herokuへのアプリのデプロイです。

ここで、コマンドプロンプトからherokuコマンドを実行できるようにpathを通しておいてください。
システム環境変数のpathにherokuをインストールしたbinのパスを登録します。
私なら、下記になります。
C:\Program Files\Heroku\bin

まずは、コマンドプロンプトから下記を実行しherokuへログインします。

heroku login

メールアドレスとパスワードを聞かれるので入力して、ログインしてください。

次にアプリ作成したフォルダの下にいき、下記コマンドを実行してください。
heroku createで新規のアプリケーションをherokuに登録します。
ここで、既存で使われているアプリケーション名は使用できないので、「 ! Name is already taken」とかのエラーがでたら、名前を変えて登録してみてください。

cd C:\Users\XXX\Desktop\nem-library-sample\node-sample
git init
heroku create sampleapp

次に、作成したnode-sampleフォルダ配下のファイルを全て、Herokuに登録します。

git add .

コミットを打つ前に下記でメールアドレスと、名前を登録しましょう。
下記コマンドの""の部分は自分のメールアドレスとユーザネームに変更してください。

git config --global user.email "you@example.com"
git config --global user.name "Your Name"

上記を登録しないと、下記のコメントがでてコミットができません。

Run

  git config --global user.email "you@example.com"
  git config --global user.name "Your Name"

to set your account's default identity.
Omit --global to set the identity only in this repository.

そして、コミットします。コミット事にわかりやすいコメントを記載してください。

git commit -m "first git sample node.js"

ついに、下記コマンドでHerokuへ登録されます。

git push heroku master

６．動作確認

上記ができたら、下記のダッシュボードから登録したアプリを選択します。
https://dashboard.heroku.com/apps

上記遷移先の右上にある「Open app」のボタンを押下すると、自分が作成したアプリケーションが呼ばれ、別ウィンドウが開いて「Hell World」が表示されるはずです。

かなり、長かったですがこれでNode.jsで作成したアプリを一般公開することができました。

これで、NEMのアプリを一般公開できますね。

次は、ついにNEMのアプリケーション（かなりしょぼいアプリになると思う）を一般公開してみるぞ！！