cujoJSはJavaScript製のソフトウェア(Creative Comonsをはじめモジュールごとに異なるようです)です。

Webアプリケーションが隆盛になるにつれて徐々にJavaScriptも大型になってきました。その結果、必要になるのがフレームワークでメンテナンスしやすい構築手段です。今回はcujoJSを紹介します。

[![](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.39.46_thumb.1371628253.png)](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.39.46.1371628253.png)
フォーム入力のデモ。コントローラ、テンプレート、それらをまとめあげるmain.jsによって構成されています。

[![](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.39.58_thumb.1371628257.png)](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.39.58.1371628257.png)
こちらはテンプレート。jQuery Templateのように${}で囲むようになっています。

[![](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.40.21_thumb.1371628260.png)](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.40.21.1371628260.png)
入力をリアルタイムに反映させるフォームのデモ。

[![](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.40.45_thumb.1371628263.png)](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.40.45.1371628263.png)
i18nにも対応しています。

[![](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.43.21_thumb.1371628265.png)](http://images.moongift.jp/2013/06/Screenshot 2013-06-19 9.43.21.1371628265.png)
よくあるTodoもデモがあります。

cujoJSは一つの巨大なフレームワークと言う訳ではなく、小さなモジュールが集まったツールキットという位置づけになっています。必要に応じてjQueryなどを組み合わせる事もできます。ユニットテストも考えられており、開発の効率化が進みそうです。

MOONGIFTはこう見る

JavaScriptはごく小さければ素のJavaScriptで、ちょっと規模が大きくなるとjQueryを使うのが一般的になっているかと思います。しかし一定規模を越えた時にjQueryだけでやっているとスパゲティ状態になることがあります。

サーバサイド同様にMVCを適切に分割して処理を行うのが大事です。実際にはそのためにはRESTfulなAPIを通じてJSONデータをモデル化して…といった具合に全体の設計が問われるようになるので、元々の構成こそが大事であったりもします。

cujoJS: Javascript architectural toolkit

デモ:cujo • TodoMVC

cujojs (The Javascript Architectural Toolkit)