[Heroku]githubからCloud9へソースを取り込みgithubへpush、Herokuへデプロイのサイクル

前提条件

githubへの登録およびリポジトリの作成、Herokuへの登録およびアプリケーションの作成、Cloud9への登録が前提となります。

Cloud9からgithubのコードをcloneする

Cloud9からgithubを連携させると、github上のプロジェクトが表示された状態となる。(以下の画像参照)この状態で「CLONE TO EDIT」を選択する。

checkoutするか聞かれるので、checkoutを選択。

Cloud9上にgithubのコードがcloneされる。

Cloud9上でコードを編集する

cloneされたプロジェクトの編集を開始する。「START EDITING」を選択する。

Web上のIDEが現れたところで、実際にファイルの編集を行おう。今回はindex.htmlにコメントを追加する。もともとのindex.htmlを開くと、

ここに、「Let’s chat!!」を追加する。

「Ctrl + S」 で保存し、githubへ変更を反映させよう。

githubへ変更をpushする

githubへの反映は、コンソールからgitコマンドをたたいて実行する。まず、「git add」

コンソールを確認。問題なさそう。

次に「git commit」

コンソールを確認。こちらも問題なさそう。

最後に「git push」

コンソールを確認。大丈夫そう。

反映されたことをgithub上から確認してみよう。

コミット時のコメント「index.html edited」が反映されている。問題なさそう。

Herokuへデプロイする

左サイドバーにある「Deploy」を選択し、+アイコンを押すとデプロイ先があがってくる(Herokuを登録してあればだが)

デプロイ先としてHerokuがActiveとなるので、アプリケーションをクリックする。

そして、「DEPLOY」を選択。

デプロイされていることを確認する。

このサイクルをまわすことでアプリケーションをどんどん改善していこう。Cloud9ではデバッグの機能もついているので、クラウド上で開発→テスト→デプロイのサイクルが実行できるようになる世の中になってしまったのですね。

[Heroku]node.jsで作成したアプリケーションをHerokuにデプロイしてみる

Node.js

Node.jsを一言で言うとリアルプッシュが実現できます。いままでのリアルタイム更新が必要なアプリケーションは「疑似プッシュ」という技術を利用して行われていました。
外国為替FXのアプリならば、時々刻々とかわるレートを更新する必要がありますが、アプリ側で内部にタイマーを保持しており、定期的にサーバにレート更新依頼を投げることで
レートの更新を行っていました。この技術を疑似プッシュと言います。
ブラウザベースのアプリならばAjaxを使ってブラウザがレート更新リクエストをサーバに投げています。
もっと酷いアプリになると、更新ボタンがどこかについており、更新ボタンを押さないとレートが更新されないという有様です。

Node.jsがリアルプッシュを実現しているメカニズムは
「ブラウザとサーバ間でコネクションを張りっぱなしにしておき、イベントが発生したタイミングでサーバからイベントをブラウザに送信する。」である。
コネクションを張りっぱなしというと負荷が大きいのでは?と感じるかもしれないが、WebSocketというHTTPとは異なるプロトコルを用いてHTTP通信時に発生するオーバーヘッドが減らされています。
従来のCommetとは大きく異なる点です。

キーワード
Node.js
WebSocket
Commet

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

Herokuアプリケーションを新規作成します

$ heroku create chat6287 --stack cedar

そうすると、Heroku管理画面上に新しいアプリケーションが作成されていますので確認してみてください。

このアプリケーションにデプロイしていきます。

githubにコードを登録する

リポジトリの作成

$ cd <リポジトリを作成するディレクトリ>
$ git init

そうすることで「.git」というディレクトリが作成され、gitで管理するファイル等が作成されます。

リポジトリに追加
例えばREADMEというファイルをgitにコミットする場合はまずgit addでコミットするファイルを指定します。

$ git add README

リポジトリにコミット

$ git commit -m 'コミットメッセージ'

リモートリポジトリ(ここではgithub)の追加(リポジトリを作成した最初だけに行う)

$ git remote add origin git@github.com:[User Name]/[Repository Name].git

リモートリポジトリに変更を適用

$ git push origin master

Cloud9 IDEでHerokuにデプロイする

Cloude9 IDEにアカウント登録すると以下のような画面が開きます。

次にgithubをactivateします。

allowを押すとactivateされます。

この状態でgithubに登録したプロジェクトが読み込まれるので編集画面へ遷移します。

Deployボタンからアプリケーションをpushしてやるとデプロイ完了となります。

アプリケーションを確認してみる

Go Chat Application