WebSocketクイズアプリを作りました

約３週間ぶりのエントリですね。(^^;
気が付けば新年度。道理で電車が混んでるわけだ。。。(--

この一ヵ月ずっとSalesforce1 Mobile Hack Challengeに出す用のアプリを作ってました。

んで、作ったアプリがこちら

アプリケーション(http://www.quizar.info/)
説明動画(https://www.youtube.com/watch?v=tWoEzYr3rps)
説明スライド(http://www.slideshare.net/shunjikonishi/websocket-32921771)
ついでにソースコード(https://github.com/shunjikonishi/ws-quiz)

複数の人が集まってクイズ大会ができるパーティアプリみたいな感じのものですね。(自分の行動範囲の中では)主にIT系の勉強会での使用を想定してます。

コンテスト的にはSalesforceを使ってないという時点でもうアウトなんじゃないかという気がしなくもありませんけど。。。(^^;

コンテストの結果はともかく、このアプリの最大のテーマは、

業務アプリの作成ではまだまだリスクがありそうに感じる最新技術を使い倒す

ことだったので、それはそれで価値のある仕事だったんじゃないかと思います。
もちろん、このアプリがどこぞの勉強会で使われるのであればそれはとても嬉しいことです。

★WebSocketアプリの可能性の話

今回クイズアプリとして「出題者 vs. 参加者」というモデルのアプリケーションを開発したわけですが、個人的にはこうした「ルームマスター vs. 参加者」というモデルのアプリケーションが存在するということに気が付いたことが最大の収穫でした。

これまでずっと「WebSocket、理屈はわかるけどどういうところで使うんだろ？ゲームとかか？」みたいなことを思ってたんですが大間違いでしたね。

そんな風に思うのは既存のhttpの枠組みでのWebアプリに慣らされすぎているための視野狭窄だったと今にして思います。無意識のうちにこれまで存在したアプリの中でどこにWebSocketを適用するのが有効なんだろう？という方向に思考が制限されていたわけですね。

WebSocketの例としてよくチャットが引き合いに出されることもその視野狭窄推進に一役買っていると思っていて、これなんかも結局は「今までこうだったものが、こう変わります。」という説明でしかないわけです。そしてその説明が納得感の高い物であるが故にそこから先に進むことが難しくなっていた気がします。

WebSocketを考えるのであれば、むしろ今まで世の中に存在しなかったモデルのアプリケーションを作る、という方向で考えた方が良いと思います。
多分そこには宝が眠っています。(^^;

★クライアントサイド技術要素の話

このアプリで使用しているクライアントサイドの技術要素にはだいたい以下のモノがあります。

WebSocket
SessionStorage
PushState
CSS3 Animation

本当はあとWebWorkerを使ってみたかったんですが使いどころを思いつかなかった。(^^;

ひとつひとつは既に日本語での詳細解説ページも多数あるので目新しい物ではないですが、お試し程度に使っているのではなくちゃんと一つのアプリを作るために協調的に使われているというのがミソです。

例えば

Ajaxは一切使わずに通信は全部WebSocketで行っている
テンプレートは全部SessionStorageに入れて使いまわしている

というようなことをやっているんですが、このあたりは理屈ではできると思ってもなかなか実案件には適用しにくいモノなんじゃないかと想像します。(一昔前のAjaxがそうであったように)

実際のところ、これらのことをアプリ開発の度に作りこむのは辛すぎるので何かしらのフレームワーク的なモノを使いたくなるんですが、現状ではそうしたライブラリもほとんどないので全部自作です。(^^;;;

次回以降こうした部分についてのノウハウを書いていきたいと思います。

乞うご期待！(全然関係ないですが今日は4月1日ですね)