「JavaScript ゲーム製作勉強会 Vol.1」参加ログ

巷で話題の9leap凄いですね、未来の若手プログラマの腕試しできる場を提供するという視点が素敵です。

KAYACさんがjsdo.itでブラウザ上のjavascript実行環境を提供した先行例に継ぎ、実行環境＆ユーザ・製作者相互評価機能＆ゲーム開発ライブラリenchant.jsまで合わせて用意されるという至れり尽せりっぷり。

と、9leap礼賛はまたの機会として、5月15日(日)開催の「JavaScript ゲーム製作勉強会 Vol.1」へ行ってきました。

場所は毎度お世話になっています大森ニフティさん。

土日大工で何つくろうの前に選択肢を広げたいという欲があったので、今回のイベントは素材集めとしても非常に有意義なものでした。

以下、毎度ながら自分用メモ残します。

***
司会・講演者：@hakoberaさん

ゲームの構成要素
・Soft Realtime　時間遷移
・Interactive　プレイヤー
・Agent Based　アイテム・オブジェクトの相互作用
・Computer Simulation　　


コンピュータ内の新世界
独自時間軸、登場人物、ルール

・３DCG
・AI
・物理演算
・Agent間通信
・UI設計
・巨大NW

JS利点
・動的型付け
・プロトタイプベース

GoogleChrome V8
ブラウザベンダ間で

V8/nitro/spider monkey..
かつての数十倍速度に


考慮すべきポイント
・Logic　
・Graphic　Canvas/WebGL/SVG/DOM
・Sound
・Movie
・NW
・Input

用途に合わせた仕組み選び
・DOM
・Canvas/WebGL

参照：SVG Girl
15 flameならリアルタイムでもいける


管理すべき項目
・タイムライン
・入力系
・シーン
・リソース
・イベント
・描画
・サウンド

参照：アクアリウム


JSの死角
ハードウェア非サポート
ジョイパッド等も

カメラ
StreamAPI

Audio API/音鳴らす制御系は地味,互換性ない
(Chrom:web audio api/ FF:AUdio data api)

スマホ
audio鳴らすと全画面再生になってしまう

PCよりCPU貧弱
iPad2はPCより描写10倍遅い…
→GPU描写なら早いが、Canvasでは遅い

コーデック問題（audio
MP3
Ogg

(video
H264
Ogg Theora
WebM


PCだけならFlashに絞るのも有り。

IE9 XPでは動かない
IE6,7,8 Canvas動かない

Chrome Web Storeみたいに割り切りとか。（Google I/O


Game Loop
初期化してGameFrame書き換え
1秒間繰り返しFPS

C言語なら…
function main(){
    init();
    while(alive){
        var key = getInput();
        processInput(key);
        move();
        draw();  
    }
    exit();
}

JSなら
function main(){
    init();
    setIntarval(function(){
        var key = getInput();
        processInput(key);
        move();
        draw();  
    },2000);
}



window.addEventListner('keydown',KeyManager.keydown)
でgame.js呼び出し

timer = setInterval(mainloop,INTERVAL)
反復

→X
↓
Y
（上に進める際は、v*(-1)）

myloop内で当たり判定等…実装

300行ほどで簡単なゲームも実現！


巷のJSライブラリ

enchant.js

Canvas
  sc
  lime
  easel
  imapct

WebGL
  GLGE
  Three.js


データ駆動開発
ライブラリ

組み込みスクリプト
Unity
Server Side JS
Node.js

GWT
Javaで書いて、JSにコンパイル

参照：playwebgl/games/Quake2



JSでの実務現場レポート
講演者：@souさん
  web app /game engineer

実務
 Flash 動かん…
 HTML5で開発しなおす

農園ホッコリーナ for iOS
mbgeの女性人気No1

DeNA@スマフォ

海外
Bandit Nation（CSS3
Pirate Nation

国内
怪盗ロワイヤル…
海賊トレジャー
農園ホッコリーナ


アクション部はCanvasで

忍者ロワイヤル
ngCore(フレームワーク名
JavaScript
クロスプラットフォーム


農園ホッコリーナ for iOS
iphone
パフォーマンス
３G回線

作ってみて…

農園の様子
アニメーション表現
（Canvas/Sprite Imageで位置ずらしパラパラ漫画）
320*386px
８FPS(@iphone4

iphone3GS > 4（Retina対応で描画パフォ落ちる） > iphone3(HWスペックつらい)

１Mapに30〜40オブジェクト数
11〜40KB/枚
トータル300〜400KB

通信
XHR

遊んでもらえるものは作れそう…

描画
３GのHW性能…チューニング次第
Retina対応…難度高い（データ量で解像度きつい


wi-fiならさくさく
３G回線でもそこそこ

電車内移動中つらい

XD（クロスドメイン）通信ハンドリング
XHR2待ち
JSONPでは待機ビジーで通信こける


通信
サイズ減らす
読み込まない工夫が必要

キャッシュ技術使えば…

HTML5で使えるキャッシュ
・Application Cache　…魔人ウォーズ(最初にすべてDLする場合有効だが、個別DL系は厳しい
・local Storage(2.5MB　ドメインに対して上限
・sessionStorege(2.5MB
・WebGL SQL Databese（5-50MB


Retina対応
解像度4倍
データ量2倍強
iphone4 描画性能で限界


高解像度対応はいずれ通る道
BMPデータをオンラインで←つらい

キャッシュ、データ保持強化
データフォーマット（ベクターで受け取るとか、SVGでCancasレンダリング、SWFが適当？

SWF→JSコンパイル系ライブラリなら使える？

新しいテーマ
WebGL
XHR2,etc

画像ファイル系：ガラケー→スマホへ圧縮



「玉転がしゲームで学ぶUnity入門」
講演者：@nakamura001さん

ヒエラルキーブロック
・画面表示される
プロジェクトブロック
カメラビューブロック

GameObject作成

マテリアル作成
作成後、ヒエラルキーブロックへD&D

Floor　色変更　
ライト追加（デフォでは無いので

Player
玉を作成

Player Material

Projectに画像ファイルをProjectブロックへD&D
で、Playerに追加で反映される

Main CameraのInspecterのPosition変更

Projectで
JS/C#/BooScript(pythonっぽい？)
選んでPlayerActionと変名（PlayAction.js）

スクリプト：
var x = Input.GetAxis("Horizontal)*Time.deltaTime*power; …(※deltatime処理オチ等への遅延時間


玉転がし…なので物理エンジンを使おう

Player選択後、CreateObjで→CommponentのPhysics選択
右クリック→Import packageからでも可能


JSを変更
rigidBody.AddForce(x,0,z)として物理エンジンのパラメータを与える

Fireのボタン操作でY軸にAddForceしてジャンプ機能追加


HierarcyにCubeを追加”Goal”と命名
ProjectでGoalMateialとしてパラメータいじって、Hierarcyの”Goal”CubeにD&D

GUI Textを追加
名前をGame Clearとして
Projectで、JS追加”GoalAction”

var player: GameObject;
var gameClear: GameObject;

function Start(){
    player = GameObject.Find("Player);
    gameClear = GameObject.Find("GameClear");
    gameClear.active = false;//初めは隠す
}

sendMessage()で他オブジェクト内の関数をCall可能



X360 Kinect hacks
「KinectどうしのNW対戦」
講演者：@ndruger

利用技術
node.js
websocket（少ない帯域で通信＆Server Push可能
webgl（OpenGL ES2.0がブラウザで使用可能
VR920(HMD)…映像＆地磁気センサーで見ている方向取得可能
Kinect…モノヒトの位置トレースできる


リモートNode.js

Webブラウザ（WebGL描画
ローカルNode.js

TCP
顔の向き（iWear SDKアプリ
部位のXYZ（OpenNlアプリ


使用ライブラリ
Sence.js（WebGLライブラリ,Tree構造でわかりやすい
glMatrix.js(3Dの演算、手の伸縮・角度計算
Node.js（サーバ、クライアントの各Player計算
Sochet.IO（WebSocketのラッピング、WebSocket未対応のAndroidへの操作対応


Kinect+ブラウザの未来（妄想で

ブラウザの機能としての規格化
・簡単導入→規格化
Scene.jsのObject変換が手軽になる
・誰でも容易に何かを触ったりできる
フィードバック用の安価なハードウェア広まる
→物体を触れる装置の普及、振動を起こす等も


ダミープレイヤー
（一旦動いて撮影したデータ再生による

CPU使用量からKinectゲーム(30fps)をMMOとしてやるのは厳しい

3人以上のエミュレート
・２〜５人くらいで誰かが一時的にサーバ立ててゲームするのが良い
・パケット量を削減してないと4人でも６Mbps消費

ブラウザ＋Kinect＋HMDを使って、すごい没入感世界が大掛かりな機材なし、体験共有できる
※SecondLifeでは視覚以外の体験もあれば良かった


以上がLTメモです。

二部ハッカソンは私都合により参加できませんでした、残念…。

”AppEngine ja night #13”参加録

行ってきました、”AppEngine ja night #13”
http://atnd.org/events/11626

コンテンツは、

・セッション1 「mixiアプリ『Xmas 2010』開発トピック」
・セッション2 「mixiアプリ『the Actress』運用にあたっての課題へのチャレンジ」

以下自分用メモ。

***
【AppEngine ja night #13】

バスキュール社

田中さん
担当：プロデューサー・スタッフィング・技術可不可・コンテンツ品質向上

2000年
Web制作会社として創業

インタラクティブコンテンツ制作企業

スタッフ40名＠西新橋
プランナーディレクター12名
AD,デザイナー8名
クライント側ディベロッパー20名（Flash）

サーバ側委託が多い
withビープラウド社


ケータイコンテンツも手がける
・Gyorol


AmazonEC2事例
「新宿駅前浴場」
AXEのプロモーション

Ustream
Twitter連動コンテンツ
→1秒間15ツイート
→リアルタイム回答受付


『ネットで社会をおもしろくしたい！』


ネットのコミュニケーション
ソーシャルグラフをいかに利用するかが鍵
Facebookが公開グラフしているように…


・mixi Xmas
2週間で100万人
・AXEヨバゲー
・mixiFes

mixi application
・mixi Xmas2010
・The Actress


北島ハリーさん
5年目プログラマー
テクニカルディレクター

mixi Xmas企画
クリエイティブ進行担当

ポイント獲得
好みの靴下を飾る
確率でクーポン出る
有料でギフト送れる

ケータイからも見れる
25日当日に靴下にプレゼント届く

とある評価：リア充アプリｗ

エモーショナルなイベントですが。。
クリスマスまで1ヶ月→飽きがこない

迷いのない動線、ユーザインターフェース
分かりやすくて可愛いもの。

普遍のストーリーは演出

インスタントくじ
リアルな商品が当たる。

ソーシャルギフト
QRコードにアクセスするとバーコードが出る
ソフトバンクギフト提携でセブンイレブンの店頭で商品交換可能！

12/1～12/25
アクセス250万人
鳴らされたベル数8000万回
最大秒間620req

LAMPで作るといくら…？^^;


開発環境
・Flash
・Java
・AmazonEC2
・Paymentプログラム
・ソフトバンク連携


◇mixi Xmas
森田真克さん@mouri45
あゆた社

ソーシャルアプリ受託

mixi / OpenSocial
GAE/J(Slim3)
PC版にはJSONデータ送受
PCアプリ版、モバイルアプリ版

2ヶ月実装は1.5ヶ月
WebAPI20（リリース後に+3
モバイル画面50（リリース後に+15
Kind数12

秒間620Req
1日2200～2500万
12/1～12/24　約5億3000万
ダイナミックリクエスト

朝がピーク、通勤通学中と思われる（制限一日1回あり）

最大インスタンス420
DataStore　95GB
レコード数は2億件

【GAE開発ノウハウ】
設定情報をstaticにして保持！
Memcasheへのアクセスを減らす

アプリケーション全体で利用する設定情報
Static変数が空、有効期限切れならMemchacheまたはDataStore

設定更新までのタイムラグは発生
AppEngineAPIなるべく使いたくない。


mixiアプリ制限
クライアントからのリクエストへのリスポンスは10秒制限
それ以上はタイムアウト

JOIN停止
モバイルアプリでは一定時間に一定回数タイムアウトすると新規ユーザ登録停止

データストアへの集中アクセスにより、時折リスポンスに3秒～6秒ほどかかった

JOIN対策
requestがキューにたまる時間を削る

DataStoreアクセス時のデッドラインを指定する
DataStoreServiceConfigを使用するとDSアクセスの制限時間を指定可能！

LowLevelAPIでDataStoreServiceConfigのdealine指定
JavaDocから参照

Slim3でも同様
アクセス毎ならタグに書く

Spin-upへの施策
インスタンス起動時間
Static変数をフラグにしてSpin-upの判定
モバイルはリダイレクト対応

WarmUp Request利用
クエリよりバッチゲットを優先
不要なSinglePropetyIndex作らない

検証は不十分なところもあった


カスタムインデックスとマージジョンは控えた
※画像を修正したときに起きるらしい…？

件数多いkindはマージジョイン利用時にカスタムインデックスつくろうとする。


task queue を多様
ベル鳴らし時に相手にポイント付与
しかし秒間数百回となる可能性を考慮して実用は控えた

決済機能に対してこれを使用
※デフォルト値10回、設定ファイルいじれば問題ないらしい


GAEでPageView取得したものの…
GoogleAnalytics、モバイル版imgタグ使ってリクエスト誤るので
別GAEアプリにimgタグを用いてアクセス数を取得した（迂回
→予想以上に費用高くついたので、最終的にEC2にApacheでログを集めた


キーの命名
先頭にタイムスタンプ付けてクエリ結果ソートできる…が
GAEのBigTableはTabletServerにより管理される

ひとつのTabletServerにアクセス集中
数百PPS

キー文字列先頭にハッシュ値をつけることでひとつのTabletServer分散


GAE劇的にパフォーマンス改善
GAEソーシャルアプリに向いてる
GAE/J+Slim3＋Eclipseのすすめ


Q:ログ拾うのになぜEC2使う？
A:mixi10秒制限へのServletの負荷を軽減


※キー分散
自動採番でPutが多い場合は考慮すべき
1組1000個程をTabletServerに送りつける事情を考慮した

TabletServerのインデックスのプロパティに書き込み


◇The Actress

山手線のトレインチャンネルで流された期間もあり
Luxの既存顧客は30～40代対象だが、20代以下にターゲティングしたためmixiアプリにした

女性向け
mixi
バナー
いわゆる女優ゲーム

「シンプルさ」でなく「詰め込んで」体験できるゲームにした
平均滞在時間1回10分ほど
1日平均4回アクセス

通算80万人登録（75万
DailyActiveUser10万以上（ピーク20万

ピークタイム200～300Req/Ssc

1日1000万～1500万リクエスト

GAEインスタンス数およそ500
ピークで1.5倍増大

ユニリーバ
バスキュール＠大阪
（mixi、イラスト、映像制作、声優キャスティング）
テラポート
（コンテンツ開発）
バスキュール
テレポート＋ビープラウド（GAE運用）
6ヶ月長期プロジェクト


ビープラウド
岡野さん
@tokibito

プログラミング言語はPython
GAE API Expert @lanMLewis

mixiアプリ

PC側　Flash
モバイル版　動的にHTML生成

GAE/python
Kay Framework　アプリ数80個

秒間同時リクエスト数100～200

Kay Frameworkについて
@tmatsuo制作

アーキテクチャ
Django風
Jinja2テンプレート
Werkzeug（ベルセルク
国際化（Babel
遅延ロード


短時間でDeadlineExceedError
ImportError
有効URLで404
メモリ使用量制限落ち

DeadlineExceedError
タイムアウト
SDKでは2箇所で定義されている
（google.appengine.runtime.apiproxy_errors
google.appengine.runtime）

エラーハンドリングしないといけない

※起きうる状況
・API呼び出し
・FileIO
・システム系Call

Spin-up時のImportで起きた

APIフォール
Pythonもってる

モジュール数多い箇所でエラー

ImportError
Jinja2は初回でモジュールたくさん読み込む
テンプレートロード中で中途半端に

Spin-up時のモジュールに注意
warmupを使う

GAE/python
集計時のメモリリーク


1リクエスト処理を減らす（タスクキューで分割
モジュールは遅延ロード（使用頻度低いのはロードを控える
変数のキャッシュを減らす（MemChacheとか

ListよりもIterate系でとるべし


◇まとめ

2日半で100万人
1週間で200万人
想定外の集客

コスト：今までの6案件のなかでの概算値
1000万リクエスト＝100ドル！（すべてDynamicRequestの場合）

LUXは1日1000～1500万アクセスだから…
ケタ違いに安い（ゼロ一つ安い）

インフラが心配で却下してきたことも…
（イニシャルコスト・スケーラビリティ）

TVやイベントをネットと連動でも！
大多数ユーザとのデジタル体験の提供が可能

システムリソースが確保できても経験もつ人的リソースが足りない！
ソーシャルグラフ利用のサービスもやっていきたい。
***


【所感】
・1000万リクエスト＝100ドルで運用できるインフラはインパクト大！

・企画力、アイディア大事。使ってみたいと思えるサービスあってのクラウド。

・情報の収穫逓増。集めたデータを利用してさらなる価値が産まれる。

Google Map API ver.3とATND API の連携

Google Map ver3.からAPIキーが不要になったので使ってみたメモ。

せっかくなのでATND検索APIを叩いて、その検索結果イベントをGoogle Mapに表示するところまで。
（ATND検索APIからはJSONで取得してます）

①事前に呼び出し元のHTMLページ内に

を組み込んでおく。


②下記のように処理を書いて…

/*
* HTMLページで適当なイベント(onclick等)から呼び出す
*/
function callGMAP(){
  str = location.search;
  str = encodeURI(str);
  str = str.substring(1,str.length);
  str = decodeURI(str);
  getATNDSearchResult(str);
}

/*
 * ATNDイベント検索
 */
function getATNDSearchResult(str){
  // JSONPでrequest投げる
  str ="忘年会";
  url = "http://api.atnd.org/events/?keyword="+str+"&format=jsonp&callback=cbfuncATNDSearch";
  var script = document.createElement("script");
  script.src = url;
  $("body").append(script);
}

/*
 * CallBack of getATNDSearchResult()
 * JSONP返り値処理
 */
function cbfuncATNDSearch(json){

 marker = new Array();
 // 開いているマップ情報ウィンドウ
 var curr_infw;
 contentString = new Array();
 infowindow = new Array();

 // マップ初期化
 var centerPos = new google.maps.LatLng(35.658613, 139.745525);
 var mapOptions = {
   zoom : 10,
   center : centerPos,
   mapTypeId: google.maps.MapTypeId.ROADMAP
 };
 var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

 for(var i = 0; i < json.events.length; i++) {

  // マップ上のマークの設置
  var markerPos = new google.maps.LatLng(json.events[i].lat, json.events[i].lon);
  var markerOptions = {
    position : markerPos,
    map : map,
    title : json.events[i].title
  };
  marker[i] = new google.maps.Marker(markerOptions);

  // ウィンドウのHTML
  contentString[i] = "イベント" + json.events[i].title + "概要"+ json.events[i].catch +"日時/場所"+json.events[i].started_at+"～"+json.events[i].ended_at+" @ "+json.events[i].address+"";



  // マップ情報ウィンドウ生成

  infowindow[i] = new google.maps.InfoWindow({

    content: contentString[i]    

  });      



  // 開いているマップ情報ウィンドウを閉じて、クリックされたマーカの情報ウィンドウを開く        

  google.maps.event.addListener(marker[i], 'click', function(e){

    if(curr_infw) { curr_infw.close();}

    var gm_num = $(this).attr("__gm_id")-1;

    infowindow[gm_num].open(map,marker[gm_num]);

    curr_infw = infowindow[gm_num];

  });

}

}

③呼び出し元ページにmap_canvasタグを書いて、そこに地図を描写。

さくらVPSでnode.js

月額980円で始めるVPS（2週間の無料試用付き）ということで、さくらVPS。
サーバサイドJavaScriptとWebSocketの勉強のため、今回はNode.JSで。

iTerm等でターミナルを起動して
  ssh username@割り当てられたドメイン名
   passwaord
の入力でログイン

node.jsのインストールにあたり先行サイトを参照しつつ進めました。

【参照】

・さくらの VPS に node.js + npm + Socket.IO をインストールする手順
http://jmblog.jp/archives/709

◇gitインストール

sudo yum install gitを実行してもエラーで入らず。

…http://www.kernel.org/pub/software/scm/git/RPMS/x86_64/repodata/primary.xml.gz: [Errno -3] Error performing checksum

Trying other mirror.
Error: failure: repodata/primary.xml.gz from git: [Errno 256] No more mirrors to try.…

延々とエラー対策するも治らず…以後、次の操作したら治ったみたい

  yum check-update (したら治った？)
  yum search git (でgit発見。)
  sudo yum install git

【トラブルシューティング】
・yum 実行時に「Error performing checksum」エラー
http://d.hatena.ne.jp/miau/20100404/1270384404
・CentOS 5.4 に git をインストール
http://ameblo.jp/ootokage/entry-10469782021.html


◇nodeインストール

git cloneしたnodeを、そのディレクトリ直下で
  ./configure
するも失敗。

エラーメッセージから、事前にOpenSSLを入れる必要ありとのこと。
  sudo yum install openssl-devel

その後、再度
  ./comfigure
  make

'build' finished successfully が表示された
  make install

'install' finished successfully で、
  node -v
でVersion（この時点では0.3.0-pre）が表示されたらOK？


◇npmインストール

パッケージを入れるディレクトリでコマンド入力
  curl http://npmjs.org/install.sh | sh

するも、エラーを吐く。

node cli.js cache clean
make: node: Command not found
make: *** [uninstall] Error 127

…node cli.js install npmのところでつまづいている様子。

なので、一旦npmパッケージをダウンロードしておいて展開、

 tar -xzf npm-0.2.8-1.tgz 

  make

  make install

…しても結果変わらず。。

参照サイトを見るとインストールしたnode.jsのバージョン次第で同エラーを吐くとのこと。

なので、前に入れたnode.jsを削除してから、node-v0.3.1.tar.gz を本家から落としてきて
  tar -xzf node-v0.3.1.tar.gz 

再度
   ./configure
   make
   make install
で入った。

再び、npm-0.2.8-1直下でmake,make installで今度はOK。


◇DNSサービスの利用

1. お名前.comにログイン
2. 左パネルで、[ドメイン設定 > ネームサーバーの設定 > レンタルDNSレコード設定] と進む
3. 対象のドメインを選んで、[入力画面へ進む] をクリック。
4. サブドメインを使うなら、[ホスト名]に入力。ex: www.y-fuji.com
   サブドメインを使わないなら何も入れない。ex: (空).y-fuji.com
   サブドメイン有無の両方にする場合は、それぞれを追加する。
   
5. [VALUE]に「さくらVPSで割り当てられたIPアドレス」を入力。
   その後、[確認画面へ進む] をクリック。次の画面で、[設定する] をクリック。
6. 手続きが終わったら、[ドメイン設定 > ネームサーバーの設定 > ネームサーバーの情報変更] をクリック。
7. 対象のドメインを選んで、[ネームサーバー情報を入力する] に、「01.dnsv.jp」と「02.dnsv.jp」を入力。確認画面を経て、[設定する] で終了。

設定後、通知メールが届き、数時間程で状態が反映されました。

◇node実行テスト

動作確認のため、以下のようなコードを書いてexample.jsで保存。
※xxx.xx.xx.xxx はさくらVPSで割り当てられたIPアドレス

var http = require('http');
http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello World\n');
}).listen("80", "xxx.xx.xx.xxx");
console.log('Server running at http://xxx.xx.xx.xxx:80/');

ターミナルで
  node sample.js
で起動後、お名前.comの情報が反映されたら、その登録ドメインURLをブラウザで叩くと正常に動作。


◇サンプルアプリ起動

遭遇したエラー：process.nextTick error, or 'error' event on first tick
…installしたはずのモジュールが見当たらない。

一旦、npm uninstallして再インストールするも状況変わらず。

原因は .npmrcファイルのファイルの置き場所と記述内容でした。
.npmrcファイルをnpmモジュールディレクトリ直下に置いて、bin,manのパスを正しく通せばエラーは解決でした。

【トラブルシューティング】
・npmをインストールする
http://d.hatena.ne.jp/yssk22/20100814/1281802092
http://d.hatena.ne.jp/perezvon/20100929/1285780850


◇デバッガインストール

node.js用にEclipseのデバッガがあるので、それもインストール。

毎度のEclipseの[新規ソフトウェアのインストール]>[リポジトリ情報登録]>[利用許可承諾]>[OK]です。

[リポジトリ情報]
・(Name)Google Chrome Developer Tools
・(URL)http://chromedevtools.googlecode.com/svn/update/dev/


デバッガインストール後、テストコードを書いて、
  node --debug dbgtest.js
すると、デバッガ用に5858ポートが開いたと出るので、デバッグ可能に。

以上、環境構築でした。


【その他参照】
・node.js ハンズオン資料
http://dl.dropbox.com/u/219436/node.js/handson/build/html/index.html
・node.js を試してみた
http://d.hatena.ne.jp/ursm/20100925/1285359068

RingoJSインストール周辺メモ

Antが入ってる状態からのメモ@ MacOSX 10.5。

antのパスが通っているかは、ターミナルで確認。

  ant -version

基本的なインストールは本家サイトを参照しつつ、その前後で起きたエラーと対処について書きます。

【インストール時のエラーと対処】

・ERROR①:"Unable to access jarfile"
ant jarコマンドを打ち忘れると出るエラー。
ターミナルから、git cloneまたはダウンロードしてきたringojsディレクトリ直下で
  ant jar
すると、ringojs/build/classesにクラスが生成される。

・ERROR②:"java.io.FileNotFoundException: Can't find file admin/create"
或るサイトを参照してターミナルでアプリ作成コマンドを
  bin/ringo admin/create
と打つも、上記エラー。

正解は
  bin/ringo-admin create
の様子、バージョンの違い？

【アプリ起動】

・デモアプリ起動
インストールしたringojsディレクトリ直下で、

  bin/ringo apps/demo/main.js

のコマンド叩くとjettyが起動して、http://localhost:8080/でアプリが見れます。

・パッケージのインストール（GitであればUserID/RepositoryNameで良いとの公式サイトに…例：ringo-admin install robi42/ringo-hibernate）

上記installコマンド叩くも、ERROR③：”JavaException: java.util.zip.ZipException: error in opening zip file (ringo/zip.js#16)”発生。

zip.jsの16行目と調査リンク先を見る限り、Path周辺が問題の様子…

けれども、コマンド打たなくてもパッケージのインストールはできる(※参照)ようなので、
  git clone git://github.com/hns/ringo-cometd.git
でローカルに落としたpackageを、ringojs/packageディレクトリにコピー

その後、ringoコマンドでパッケージ内のmain.jsを叩けば、起動します。
  bin/ringo packages/ringo-cometd/app/main.js

・アプリ作成ヘルプは

  bin/ringo-admin create -h

・Google App Engine の雛型作成は

  bin/ringo-admin create -a

たしかにスケルトンが出来上がってます。
GoogleAppEngineに載せるところは未テスト。


【参照】
・RingoJS Home
・GAE deploy 参照動画
・Comet 参照動画