自作node.jsアプリを無料のクラウドサーバに登録する方法

appfog

前回の記事で紹介したappfogの無料アカウントを使って、クラウドサーバへ自作node.jsアプリを登録する方法を紹介します。Macでの紹介ですが、殆どの部分をWinでも応用できると思います。

目次

  1. 事前に準備するもの
  2. コマンドラインツールのインストール
  3. ソースプログラムの準備
  4. プログラムのアップロード
  5. 動作確認
  6. 次回はexpress?
  7. もっと詳しく知りたい方へ

事前に準備するもの

  1. appfogアカウント

    今回の紹介記事は既にappfogアカウントをお持ちの方を対象に書かれています。未登録の方は前回の記事を参考にアカウント登録を済ませておいてください。

    node.jsアプリを置ける海外のサービスappfogで無料アカウントを作ってアプリもインストールしてみました

  2. appfog 空アプリ

    自作アプリをアップロードする場所を確保する為に、事前にappfogで用意されている”Node”アプリをインストールしておいて下さい。(アップロード時には全て削除されます)アプリ名は node_mychat です。

    アプリ名 : node_mychat

    Screen Shot 2013 04 16 at 6 49 18 PM

    ↑インストールするアプリは左の”Node”を選択します

    ★コマンドを使って空アプリを作る方法もあります。ご興味ある方は、オフィシャルのドキュメントをご覧ください。

  3. サンプルプログラム

    今回は以前テットリで紹介したシンプルチャットのプログラムを使いながら手順を説明していきたいと思います。下の記事でプログラムの紹介とダウンロードできるリンクがありますので、準備をお願いします。

    【node.js】socket.ioで構築したローカルで動くシンプルなチャットルーム。みんなで書けるリモート版も公開中。

コマンドラインツールのインストール

appfogをコマンドで管理する為のツールをインストールします。

インストール手順

  1. ターミナルを起動します

    130416 0013

  2. 下のコマンドを入力してEnterを押します。

    sudo gem install af

    パスワードを聞かれるので、管理者用のログインパスワードを入力して下さい。

    130416 0014

  3. Enterを押すとインストールが始まり、下のような表示になればインストール完了です。(数字はツールのバージョンによって変わる可能性があります)

    130416 0015

ソースプログラムの準備

次はappfogへアップロードするnode.jsアプリの準備をします。以前テットリで作成したチャットアプリの一部を変更します。

  1. 今回はプログラムフォルダがデスクトップ直下にある想定で説明していきます。こちらからダウンロードしたファイルをデスクトップに解凍して下さい。

    スクリーンショット 2013 04 16 15 29 54

  2. フォルダを開いて中のindex.htmlをお使いのエディタで開き、10行目11行目を以下のように変更します。

    変更前
    <!DOCTYPE HTML>
    <html>
    <head>
      <meta charset="UTF-8">
      <title>node.js chat</title>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
      <script src="/socket.io/socket.io.js"></script>
      <script type="text/javascript">
    
    //  var s = io.connect(); //リモート
      var s = io.connect('http://localhost:3000'); //ローカル
    変更後
    <!DOCTYPE HTML>
    <html>
    <head>
      <meta charset="UTF-8">
      <title>node.js chat</title>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
      <script src="/socket.io/socket.io.js"></script>
      <script type="text/javascript">
    
      var s = io.connect(); //リモート
    //  var s = io.connect('http://localhost:3000'); //ローカル

プログラムのアップロード

編集したプログラムをアップロードします。

  1. ターミナルを起動し、下のコマンドでプログラムのあるフォルダに移動します。

    cd desktop/nodejs_chat

    130416 0021

    これから使うupdateコマンドは現在位置のファイルをアップロードします。位置を間違うと意図しないファイルがアップロードされてしまうので、間違いがないか念のため再確認して下さい。

    下のコマンドで現在位置が確認できます。

    pwd

    130416 0022

  2. 下のコマンドでプログラムをアップロード(アップデート)します。

    af update node_mychat

    “node_mychat”は事前に準備していた空アプリ名です。

    130416 0024

  3. Enterを押すと、アップデートが始まり、下のような表示になれば完了です。

    130416 0025

    以上です。

    ★ここで紹介した方法以外にもコマンドを駆使してもっと簡単な方法を開拓できると思いますので、ご興味ある方は是非ドキュメントに目を通してみてください。

アップロードしたプログラムについて

今回appfogを取材していた時に、何度かgitとの連携について記述されている記事を見かけたので、updateコマンドで登録したプログラムがgit等で自動的に公開される可能性があるかどうか、念のため調べてみました。

僕が調べた範囲では特に公開されてしまうような記述はなく勝手にコードが外に漏れていたというような事はなさそうです。目にした記事についてはgitにcommitしたコードを自動的にappfogでdeployするというような内容でした。なので、git → appfog はあっても逆はないと思います。(※念のため、最終確認は各自でお願いします)

調べた記事は最終的にはここのリンクに集中してたのでリンクを張っておきます。

How to update your app on AppFog with Git – AppFog Blog

動作確認

  1. appfogの管理画面にログインして、アプリ名”node_mychat”のDomains項目(URL)をクリックします。

    130416 0026

  2. ブラウザが起動し、チャットの画面が表示されるので、複数端末で表示させながらテキストを送ってみてください。

    130416 0028

応用編

下のチャットでは、メッセージの他にも文字色と文字サイズ情報が共有されます。複数情報をやりとりしたい時のサンプルとしてご利用ください。別ウィンドウでも開けます

ソースコードはこちら : app.js + index.html + socket.io(4.0MB)

いかがでしたでしょうか?

僕の勉強メモ的な記事になっているので、まわりくどい表現や段取りになっているところもありますが、クラウドでのnode.js開発の選択肢の1つになり、その足がかりになれば幸いです。

次のステップについては、すでに多くの方がnode.jsの開発ノウハウを公開されていますので、その記事やサイトを紹介する形で繋げたいと思います。

次回もnode.jsの紹介になるかは未定ですが、また何か気になる事があれば、記事にしたいと思います。

もっと詳しく知りたい方へ

node.jsのパッケージマネージャnpmのオフィシャルです。メジャーなものはここで探せそうですね。

npm
Node.js Home Download About npm Registry Docs Blog Community Logos …

node.jsのポッドキャスト。サイトで最新号が聴けるようです。番組もそうですが、サイトトップのリンク集で海外のnode.js情報が得られそうです。

NodeUp: A Node.js Podcast
A NODE.JS PODCAST Join us in #nodeup on freenode! SUBSCRIBE: iTunes -OR- RSS OUR LOVELY SPONSORS: …

動画で紹介しているサイト。インストールから紹介されているので、今回のテットリの記事の続きとしてちょうど良い教材になりそうです。

NodeCasts: Free Node.js Screencasts
HomeAboutContactFacebook | iTunesRSS FeedLogin with GitHub Episode 5 Thinking Asynchronously Aug 2 …

node.jsのmvcフレームワーク。MVCで組み慣れた方はここを見ると早いかもしれませんね。僕は要勉強です、、

CompoundJS
CompoundJS – MVC framework Build well-organized web apps using CompoundJS. JugglingDB: try in your …

ここも動画で紹介していますね。ぱっと見ですが、扱っている範囲は若干こっちが広いかもしれません。

Node Tuts – Node.js Video Tutorials
NODE TUTSNODE.JS VIDEO TUTORIALS Check out my e-book: Episode VIII – Handling Errors Using Domains …

投稿日

カテゴリー:

投稿者:

タグ: