JavaScriptMVC - 概要

JavaScriptMVC は Jupiter が開発/提供している JavaScript フレームワークです。 jQuery を中心に据えて、クライアントサイドの開発を助けてくれます。 JavaScriptMVC のメリットはこの辺でも触れています。

• JavaScriptMVC と一覧表示の性能 - 2011年1月13日の記事

使い方をまとめて記事にしようとしたら大変だったので、 ５回に分けて書く予定にします。

1. 概要 (この記事)
2. プロジェクトの作成
3. テストと実装
4. ドキュメンテーション
5. パッケージング

Update: 一連の記事を書き終えたのでリンクにした。

github に書きかけの gist がありましたので、最初の方を少しだけ訳出します。

• JavaScriptMVC Overview

github のレポジトリから javascriptmvc-3.1.0.zip をダウンロードしておくと、 フォルダの中身を確認しながら動かせるようになるかもしれません。 (この記事では何も動かさないけど)

JavaScriptMVC の概要

イントロダクション

JavaScriptMVC は jQuery をベースとしたオープンソースの JavaScript フレームワークです。 フロントエンドの開発フレームワークとしては (総体的に) 網羅されており、 以下の有用性のあるものでパッケージングされています。

• テスト
• 依存性管理
• エラーレポーティング
• パッケージ管理
• コードクリーニング
• 独自イベント
• jQuery 拡張
• ドキュメンテーション

ライブラリは、ほぼ独立した４つのサブプロジェクトに分割され、 UI ウィジェットを除いたほとんどすべてがあります。 JMVC の MVC 部分は、GZIP 化されるとたったの 7kB しかありません。

プラグインとしての実装

JavaScriptMVC は独立した４つのサブプロジェクトに分割されます。

• StealJS - 依存性管理、コードジェネレーター、プロダクションビルド、コードクリーニング
• FuncUnit - Web テストフレームワーク
• DocumentJS - JS ドキュメンテーションフレームワーク
• jQueryMX - jQuery の MVC 拡張

ダウンロードパッケージは、以下のフォルダから構成されます。

funcunit
documentjs
jquery
steal

それぞれのフォルダ内には、たくさんのサブプラグインがあります。 たとえば、 JavaScriptMVC のコントローラーは jquery/controller/controller.js にあります。

JavaScriptMVC を使うときは似たようなフォルダ構造にすると良いでしょう。 この文章の最後で作成する (訳注:元の記事が終わってないので未完) ToDo アプリケーションは以下のように構成しました。

funcunit
documentjs
jquery
steal
todo/
  todo.js
  todo.html

終わりに

JavaScriptMVC の概要を日本語に訳しました。 JavaScriptMVC 3 系からは、かなり大きく API が変更されたようで、 いくつかの (多くの？) ドキュメントが陳腐化しています。 API を見ていくときには注意が必要です。 特に、非同期に処理する方法を導入したことによって、いくつかの API は互換ではありませんし、 モデルとコントローラーを使うメソッドも変更されています。

• New Steal API checked into master branch

次は、Steal を使ってアプリケーションを作成してみます。