Zensen.プログラミング、カメラを中心になんでも書く雑記ブログです。node.jsのexpressでリアルタイムチャットを作る!!アプリ自体は大したことないですがHerokuでnode.jsを使ったアプリを公開する方法がわかったので、記事にしたいと思います。Toolbeltをインストールするnpmで設定ファイルを作る最後の事前準備gitを使ってHerokuにアプリをデプロイする動かす参考*HerokuとはHerokuとはWEBアプリを簡単に公開するためのWEBサービスです。公式サイトHerokuWEBアプリを公開するためには、サーバーを借りたり、ドメインを借りたり、他にも色々とにかく大変です。Herokuは、それらの面倒くさいことを代わりにやってくれるサービスになっています。こちらはとにかくWEBサービスを作るだけで良いんです。必要なものとしては公開するシステムやサービスgitが使用可能なことnpmが使用可能なこと(node.jsを使いたいので)まず、公開するサービスを作ってあることが前提です。今回私は以前node.jsとexpressを使ってルーム機能のあるリアルタイムチャットを作る!!で作ったリアルタイムチャットアプリを公開します。実装にはnode.jsとexpressを使っています。gitが使えるようになっていることが前提です。Gitのインストールなどを参考にインストールしておいてください。npmは、サーバー上でnode.jsを使うための設定ファイル作成時に必要になります。node.jsを使わない方は不要かもしれません。ちなみに、今回WEBサーバーに上げるアプリはnode.jsとexpressを使ってルーム機能のあるリアルタイムチャットを作る!!で作ったリアルタイムチャットアプリを公開しますが、WEB上に上げるにはそのままでは動きませんでした。この記事で作ったファイルの一部を修正しています。修正は1ファイルの1行だけ。8080;//ここを修正//以下省略ここだけ直せば、WEB上にあげてもちゃんと動くはずです。会社名以外は必須です。今回は開発言語と「node.js」にしました。完了画面は以下の感じ。完了していません!メールがすぐ来ているのでそれを見に行きましょう。メール内のURLを叩くと以下の画面に遷移します。パスワードを設定しましょう!これで本当に完了!以下をクリックするとマイページに遷移します。*Herokuでアプリを作る次はとりあえずHeroku上でアプリを作ります。以下のボタンを押します。アプリ名は重複できないので、ちゃんと考えないといけません。Toolbeltをインストールする最後にコマンドラインでHerokuを使うためのツールをインストールします。Xバージョン」をインストールしました。ボタンを押すとインストーラをダンロードできるので、あとはそのインストーラの指示通りにインストールすればOKです。*npmで設定ファイルを作るさあ、ここからは実際にアプリを公開する手順になります。以下は私の作ったアプリの構成になっています。「chatディレクトリ」に移動し、「npmコマンド」を使って、node.jsに関する設定ファイルを作ります。init上記コマンドを入力すると、色々聞かれます。基本的には特に入力せずにEnterでOKです。後で書き直せますからね。一応以下の質問には、適切な値を入力しておきましょう。byuzensen//その他の質問そうすると、最後に以下のように確認を取られるのでEnterを押して許可しましょう。"ISC"}OKを押すとchatディレクトリ上に「pakege.json」ファイルが作成され、先ほど確認した内容が書かれています。作成したファイルを少し書き直します。"ISC"}これで保存でnode.js周りの設定は完了です。最後に2つのファイルを作成します。(あれば中が合っているか確認してください)chatディレクトリ上に「.gitignore」という名前のファイルと「Procfile」という名前のファイルをを作成して中に以下の内容記述して保存します。.gitignorenode_modulesgitignoreには、今後中身が変更されないであろうファイルやディレクトリを指定しておきます。しておくとgitがそのファイルを無視するようになるので、無駄がなくなります。chat.jsProcfileはHeroku上で実行するコマンドを書いておく必須のファイルです。loginchatディレクトリに移動し、gitを使う準備をします。Herokuから先ほど作ったアプリのリポジトリを取得します。アプリ名そして、chatディレクトリのファイルをすべて追加し、コミットし、プッシュします。masterこれで、chatディレクトリの内容がHerokuで作ったアプリにデプロイされます。*動かすコマンドラインから以下のコマンドを入力するとブラウザでページが立ち上がります。押しても表示されます。今回できたやつbyuzensen-chatわーい!自分で作ったアプリがWEB上でアクセスできる!!ちなみに。一応WEB上に上げるということで、少しクライアントサイドとサーバーサイドのファイルを修正しています。