記事詳細
-
2012年に使いたいJavaScriptのMVCフレームワーク14選
公開日時: 2012-01-08 16:00
1億総スマホが近づいたこの頃に、JavaScriptのMVCフレームワークに何を使うか? node.jsと使ってみたいウェブアプリのフレームワークの候補を14選んでみました。
MVCフレームワークといっても、純粋なMVCだけではなく、MVVM、MVC2、MVPなど広義のMVCフレームワークを含みます。
成熟したフレームワーク
backbone.jsのように一定の歴史のあるものや、express.jsのようにnode.jsでのデファクト・スタンダードになっているようなものを含め、今すぐプロダクション環境で使用できる成熟度があると思われるフレームワークをまとめます。
Backbone.js
http://documentcloud.github.com/backbone/
古参のフロントエンド向けMVCフレームワーク。
node.jsに限らず、Rails等のフレームワークでもフロントエンド側のフレームワークとして多く使われています。
利用例やサンプルアプリ、ドキュメントが充実しているため学びやすく、導入が容易です。
Spine.js
CoffeeScriptで書かれたフルセットのフレームワーク。
サーバー、ジェネレータ、ライブラリマネージャ等、開発に必要なものがひと通り揃っています。
KnockoutJS
backbone.jsと並びよく使用されているようと思われます。
jQueryの上に構築されたMVVMパターンのフレームワークです。
モデルとUIの関係を宣言的に記述することにより、ビューの変化によりモデルが自動的に更新されるようなアプリを簡単に書けます。
ドキュメントが充実していて、学びやすいフレームワークです。
node.jsで、何らかのアプリのフレームワークを導入した開発を始めたい場合は、backbone.jsと並び導入のハードルが低いものとしておすすめです。但し、MVVMパターンに触れることが初めての場合ちょっとだけ戸惑うかもしれません。
ExtJS
jQuery UI以上に豊富なウィジェットの揃ったリッチなUIを作るためのフレームワーク。node.jsが出る以前から長く存在し、Sencha社が商用サポートも行っている安定したフレームワーク。
業務用のリッチUIのアプリケーションを作る場合などには、ウィジェットを並べるだけで充分なアプリのデザインになるため、重宝することと思われます。
Sencha Touch
http://extjs.co.jp/products/touch/
ExtJSのスマホ対応版という位置づけに思われるフレームワーク。
express
node.jsでウェブアプリを作成する場合の基本中の基本と思われるフレームワークないしミドルウェア。
viewのデフォルトはjade。
とても軽く速い一方で、expressのみで少々複雑なアプリを作成するにはexpressをよく理解したり、プロジェクトのレイアウトに自チームなりの規約等を工夫して設定する必要があるように感じます。
新しいフレームワーク
Matadorのように歴史の浅いフレームワークや、derbyやflatironのようにisomorphic(サーバー側とフロントエンド側の両方で同じフレームワークを使う)なスタイルのフレームワークなど、今すぐプロダクション環境で使用するには適切ではないかもしれないものの注目のフレームワークをまとめます。
Matador
http://obvious.github.com/matador/
2012年初頭のイチ押しのMVCフレームワーク。
Twitter社のOBチームのObvious社が公開されているnode.js用のMVCフレームワークです。
viewはhogan.js(コンパイル可能なmustache)。
モデルのバックはmongooseをODMに使ったmongo。
Klassモジュールを依存モジュールに含み、controllerとmodelのクラスに判りやすく継承関係を持ち込めるため、JavaやRailsで書いていたアプリをスムースにnode.jsで書きなおすことができるように感じました。
Valentineという関数型プログラミング風の書き方をするためのユーティリティライブラリも依存に含まれており、様々なものを簡潔に書けます(Play!frameworkのFライブラリとよく似た使い方ができます)。
route、controller、model、viewのそれぞれを結びつける部分、あるいは基本のところでexpress.jsが使われており、express.jsをより便利に使うための皮のようなフレームワークと思っても良いかもしれません。
express.jsのみでもnode.jsのウェブアプリを作成することはできますが、express.jsで書く場合はapp.jsの中にroute、controller、modelのロジックを全て書くようなスタイルになりがちで、何らかの工夫をしないとたちまちスパゲッティになりがちです。
一方、matadorを使用すると、基盤のところでexpress.jsを使いながら、matadorが整備してくれる規約に則ってmodel、view、controller、routeをかき分けることでよりメンテナンスをし易いアプリを書くことができます。
Ember.js
元SproutCore。SproutCoreの開発元がFacebookに買収されたkとにより、オープンソース版の開発がEmber.jsのほうでおこなわれている模様です。
viewはmustacheにロジックの部分を強化したhandlebarを使用。
Broke.js
javascriptのdjangoです。
djangoからnode.jsに入ってきた方には使いやすいかもしれません。
eyeballs.js
https://github.com/paulca/eyeballs.js
Ruby on Railsに似た軽量MVCフレームワーク。Rubyで書かれたジェネレータでeyeballs generate scaffold Postのようにしてscaffoldを作成できます。
インストールもgem install eyeballsのようにgemを使って行います。
viewはmustacheやjQueryなど。
o_O('Post', function() {})のような、アイボールと呼ばれるeyeball.jsの由来となっている独特の関数を多用します。
html5のオフラインで作業できるアプリを作るため、html5 local storageにも対応しています。
The M Project
スマホに特化したフレームワーク。
モバイル端末でのHTML5の使用が前提になっています。
データバインディング、localStorageへの永続化、i18nなどが最初から利用できます。
derby
node.jsを使用し、クライアント側もサーバー側もひとつのフレームワークで開発することを企図したフレームワーク。
昔のようにサーバー側のフレームワークにはRailsを使い、クライアント側のフレームワークにはbackbone.jsを使用するといったスタイルではなく、全てをひとつのフレームワークで作ったほうがメンテナンスも楽ですよね? というスタイル。
versionは目下0.1.4でまだ開発中とのことですが、サーバー/フロントエンドで同じフレームワークを使うスタイルは、次のflatironと並び今後増えていくかもしれません。
flatiron
node.jsに社名ごとコミットしているnodejitsu社が公開されているフレームワーク。
isomorphic(サーバー/フロントエンドで同一のフレームワークを使用)かつフルスタックなnode.js用のフレームワーク。
目下頻繁にアップデートが行われており、実用のフレームワークとして使うことは躊躇われますが、先のderbyと並び、node.js用のisomorphicなフレームワークとして2012年注目のフレームワークです。
batman.js
CoffeeScriptで書かれたフルスタックのMVCフレームワーク。
Railsとよく似ているため、Railsになれた方がnode.jsでアプリを書く場合に便利です。
blog comments powered by Disqus