明けましておめでとうございます。HTML5とか勉強会スタッフの小松です。2011年最初の勉強会は、「⁠ハンゲーム」の運営で有名なNHN Japan様の素敵なカフェテリアをお借りし開催しました。勉強会終了後、同会場で併せて懇親会も実施し、遅い時間まで同社のスタッフの方々には大変お世話になりました。厚く御礼申し上げます。

今回の勉強会では、セッション2本とLTを3本で、合計5本の講演をいただきました。セッションとしては、話題のスマートフォンアプリケーション開発フレームワーク「Titanium Mobile」と、Googleの話題のOSおよび昨年末に開始したマーケットプレース「Google Chrome OS/Web Store」について。LTは、HTML5関連のAPIの説明を2本と、HTML5のAPIを活用したWebアプリについてです。また、今回は冒頭で「第0回 HTML5プログラミング&クリエイティブ・コンテスト」の案内もありましたので、そちらの模様も含めレポートします。

「第0回 HTML5プログラミング&クリエイティブ・コンテスト」

冒頭で、「⁠第0回 HTML5プログラミング&クリエイティブ・コンテスト」について、本勉強会主催の白石さんより告知がありました。

このコンテストは、本勉強会スタッフが企画したもので、「⁠日本のHTML5開発を盛り上げ、サポートする」ことを目的としています。募集するカテゴリは、プログラミング部門と、クリエイター部門となっており、作品はDevelopers Summit 2011のコミュニティブースや、Google Japan Developer Relations Blogなどで紹介する予定です（応募多数の場合は別途選考を実施予定です⁠）⁠。

詳細は、こちらのサイトをご確認ください。html5-developers-jpに参加されていれば、どなたでも応募可能ですので、奮ってご応募ください。

「Titanium Mobile」

最初のセッションは「Titanium Mobile」について、appceleratorの増井さんに、講演いただきました。

Titanium Mobileは、スマートフォンのネイティブアプリケーションをJavascriptで開発可能とするフレームワーク。iPhoneやAndroidなどのクラスプラットフォーム開発を容易とします。JavascriptとしてNode.jsでも採用しているCommonJSを用い（よって、ブラウザのJavascriptとは若干違います⁠）⁠、インタプリタ経由でネイティブ機能にアクセスするアーキテクチャを採用しているとのことです。このため、カメラ操作などを含めた、殆どのネイティブ機能に対応しているとのことでした。

注意点としては、インタプリタを用いるため、リアルタイムゲームやメモリを消費するタイプのアプリケーションには向いていないとのこと。しかしながら、Objective-Cなどを用いたNativeコードで拡張モジュールを作ることが可能とのことで、スピードが求められる部分についてはこのモジュールを用い、柔軟性が求められる部分についてはインタプリタを用いるといったように、要件に応じたハイブリッド開発が可能であることが紹介されました。

後半では、増井さんがappceleratorに入社された経緯についてもお話いただきました。熱い情熱と、一度断られてもあきらめないその姿勢が、とても興味深かったです。資料はこちらで公開されています。

「Google Chrome OS/Web Store」

続いて、「⁠Google Chrome OS/Web Store」について、Googleの及川さん、北村さんより講演いただきました。

最初に、Chrome OS搭載のNet Book（Cr-48 Chrome Notebook）を用いたデモンストレーションを及川さんが行ないました。

Googleアカウントでログインするだけで、PCでの設定状態（テーマやエクステンション、ブックマークなど）が引き継がれるため、Factory Installの状態からでもほとんど設定することなく従来の環境をそのまま利用可能であることが示されました。

利用可能なアプリケーションは、Webベースとなっており、一時ファイルとしてファイルシステムを利用可能であったり、スリープから瞬時に起動すること、電源シャットダウン状態でも10秒程度で高速に起動することなどを紹介いただきました。なお、IMEとして、Google 日本語入力がインストールされているとのことです。

その後、ウェブアプリを配布・購入することが出来るマーケットプレイスとして昨年12月7日にローンチされたChrome Web Storeについて北村さんから紹介されました。

現在の登録アプリ数は約2,200で、chrome extensionやテーマとも統合されているとのこと。利用ユーザによるレーティングやレビューなども確認でき、インストールも容易なため、購入から利用までシームレスに行えることが示されました。paymentシステムが整備されているため、マネタイズも可能となっています。アプリケーション販売にあたって、Googleへのレベニューシェアは0%で、手数料と開発者登録料のみが必要とのことでした。

後半は、「⁠Web Applicationとは何か？」について、5つのポイントが紹介されました。一つは、「⁠機能の絞り込み⁠」⁠。インストールの際、ユーザはアプリ起動までの間、期待を持ち続けます。その期待に即座に応えられるよう、First Impressionで何のアプリかが分かるような機能の絞り込みが重要であるとのことでした。他に、「⁠画面全体を活用すること」「⁠リッチなエクスペリエンスを提供すること」「⁠美しいこと」そして「スピード」がポイントとして挙げられ、例えば「スピード」に関してはApplication Cacheを用いることでロード時間を改善できることが示されました。

「Cross Origin Resource Sharing」

LTのトップバッターは、クロスオリジンでのAjax（XML Http Request Level2）などに利用されるセキュリティモデルである「Cross Origin Resource Sharing」について、筆者の小松より紹介させていただきました。

CORS （⁠Cross Origin Resource Sharing）は、ブラウザーサーバ間でやりとりされるHTTPヘッダのメッセージングにより、クロスオリジンでのリソースアクセスに関するルールを規 定するものです。最新のAjax仕様であるXML Http Request level2やWebFontでのクロスオリジン通信では、このモデルが用いられており、HTTPメソッド（GET, POST, PUT, DELETE）やクッキー利用の有無により使い方が異なってくる点や、現状クロスオリジンで良く用いられているハック（JSONP）との違いについて紹介させていただきました。

「WebStorage」

LT2本目は、ブラウザで KVS（Key Value Store）を利用可能とするAPIの "Web Storage" について、スタッフの吉川さんより講演いただきました。

WebStorageのAPIの使い方や注意点、さらに実際に使われている例などが紹介されました。Web StorageはKVSとなっており、キーに対するバリューの格納と検索が可能なAPIで、単純ながら非常に簡単に使えるのが特徴です。講演では、値の格納や取得方法などAPIの詳細が紹介され、さらにクッキーとの相違点や、オリジンベースに由来するセキュリティ上の注意点と容量制限などが詳細に説明されました。また、twitterなどでの利用事例も紹介されました。

講演の中で紹介されているとおり、WebStorageはIE8から利用可能であり、また使い方も非常に簡単です。是非、活用してみてください。講演資料は、こちらで公開されています。

「Finder風オンラインリポジトリ」

最後に、HTML5とその関連仕様を活用することで、自身で開発された「Finder風オンラインリポジトリ」について、東京工科大学の大学院生である井原さんさんより講演いただきました。公の場でプレゼンされるのは初めてとのことでしたが、非常に分かりやすいプレゼンで、また内容も素晴らしいものでした。

開発されたのは、MacのFinderに似たユーザインタフェースで動作するオンラインリポジトリ。HTML5の技術を使うことで、ブラウザのみで利用可能としています。非常にスムーズに、リポジトリ内のディレクトリ操作が可能となっており、画像や映像などもワンクリックでプレビュー可能という優れたアプリケーションに仕上がっていました（この際、会場からは感嘆の声があがりました⁠）⁠。

使っているHTML5関連の機能は、Drag & Drop APIとXHR2それにCSS3。プレビュー機能には、open social gadgetを利用されているそうです。サーバサイドでは独自実装のリポジトリData StoreとApache shindigを連携して動作されているとのこと。実際に学内でも利用されているそうです。Open Sourceでの公開も予定されているそうです。楽しみですね。

最後に

HTML5関連の話題は収まることをしらず、様々な興味深いトピックが目白押しです。本勉強会では、これからも最新の旬の話題をみなさんと共有できるよう、盛り上げていきたいと思っています。今年一年もまた、よろしくお願い致します。

レポートに対する感想や、勉強会に対する希望・意見・取り上げて欲しいテーマなどありましたら、twitter(@komasshu)までお気軽につぶやいていただければと思います。

本勉強会は、毎月第3水曜日もしくは第3木曜日に開催していますので、興味を持たれた方は是非ご参加ください。開催のアナウンスはhtml5-developers-jpで行われますので、こちらをチェックください。来月も開催予定です。お楽しみに。

なお、筆者が管理しています、こちらのサイト（Events in HTML5-jp）で開催状況や、過去のアーカイブなども公開しておりますので、是非ご活用いただければと思います。

また、私事になりますが、この度Google公認のAPI Expert(HTML5)に就任することとなりました。勉強会主催の白石さんや羽田野さん、それにChrome Extensions Expertの太田さんと共に頑張っていきたいと思います。よろしくお願いします。