読者です 読者をやめる 読者になる 読者になる

HTML5モバイルアプリケーションフレームワーク Sencha Touchパーフェクトガイド

Sencha book

会社の同僚達がSencha Touchの本を書きました。
僕自身はSencha Touchをほとんど触っていないのですが、せっかくなので読んでみました。

HTML5モバイルアプリケーションフレームワーク Sencha Touchパーフェクトガイド

HTML5モバイルアプリケーションフレームワーク Sencha Touchパーフェクトガイド

感想

本書の想定読者としては、ある程度HTML5JavaScriptを知っていることが前提になっています。HTMLやJavaScriptの基本的な文法の説明は出てきません(SassとCompassについては詳しめの解説がありました)。

本書は3部構成になっており、第1部は簡単なチュートリアル、第2部はSencha Touchが備えている基本機能の解説、第3部ではチャートやDropBox連携などのより実践的な内容を解説しています。

Sencha TouchはロジックもビューもJavaScriptで実装していくフレームワークなのですが、JavaScriptなのにプロトタイプベースではなくクラスベースのオブジェクト指向プログラミングができるようになっています。独自のクラスシステムを備えており、継承やミックスイン、シングルトンなど、JavaScriptの言語的に不足している部分を補っています。ここまでくると、ただのWebフレームワークと言うよりも言語拡張と言ってもいいかもしれませんね。
レイアウトの表現にはHTMLやXMLを使わずJavaScriptのオブジェクトで表現し、細かなデザインをSass/Compassで作るというのも面白いです。
また、フレームワークには規約がたくさんあります(setterの前後に呼び出されるメソッド名はapply/update+オプション名にするなど)。Railsの影響を強く受けてる印象です。
さらには、リストのグルーピングや、PullRefresh(リストの一番下でぐっと引っ張って更新するやつ)のようなUI、ネイティブアプリとしてパッケージングする機能など、モバイルアプリ特有の機能を多く備えているのも特徴的だと思いました。

こういった言語拡張やレイアウトの書式、フレームワークの規約を知らないとアプリケーションを書くことは難しいと思うのですが、現状では日本語で本書のように体系立てられた情報はほとんどないようです。
そういうわけでSencha Touchのアプリケーションを開発する人にとって本書は大きな助けになると思います。

MVCの説明について

さて、本書はSencha Touch開発に役立つ良書だと思いますが、MVCパターンの説明で少し気になる点がありました。
本書では、モデル層をデータの入れ物(エンティティ)であるという説明をしているのですが、そういう分け方をするとコントローラが肥大化してしまう可能性があります。
第3部では「ビジネスロジックをモデルとコントローラのどちらに記述するか判断できないためサービス層を導入する」という説明もあるのですが、MVCはプレゼンテーションとドメインロジックを分離するためのものなので、ビジネスロジックはモデルに入れるべきですね。その上で、モデルをデータアクセス層とサービス層に分ければよいと思います。
特にSencha Touchには、プロファイルというデバイスごとにビューやコントローラを切り替えるためのステキな機能があるので、なおさら共通処理はモデルに入れてコントローラを切り替え易くしておくべきです。
Sencha Touchが用意しているベースクラスの名前が「Ext.data.Model」になっているので勘違いを生じやすくなっている影響もありそうです。(RailsCakePHPも同様の問題が指摘されていたりしますね http://d.hatena.ne.jp/MugeSo/20121224/1356345261

MVCの話はネット上でも定期的に話題になりますが、MOVEは望まれなかった子 - the sea of fertilityが分かりやすくておすすめです。
SQLアンチパターンの「24章 マジックビーンズ(魔法の豆)」でも、「モデルがアクティブレコードそのものになる」というアンチパターンが紹介されていました。

F#で写経!?

本書を読みながら写経しようと思い、WebSharperのSencha Touch拡張を使ってみました*1
これを使うとF#で書いたコードが、Sencha TouchのJavaScriptコードに変換されます。

Visual Studioで型安全にさくさくコードが書けるのがステキ!と思っていたのですが、生成されたコートがSencha Touch 2系に対応していませんでした。
WebSharper自体はオープンソースなんですが、Extensionはソース公開もされていないですし。残念。

*1:普通にJavaScriptを書いても面白くないですからね