HotDrink - JavaScript製のMVVMフレームワーク
WebアプリケーションがJavaScriptを活用することによってどんどんリッチになっています。そうした中で、徐々にMVCを使ったフレームワークに注目が集まっています。 さらにMVCの派生パターンとしてMVVM(Model-View-ViewModel)が知られています。今回はそのフレームワークとして作られているHotDrinkを紹介します。
HotDrinkの使い方
HotDrinkはかなり独特な記述によってWebアプリケーションを開発します。例えば以下はその一例です。
var model = new hd.ModelBuilder()
.variables( "symbol, favorite, number",
{number: 10, favorite: "ADBE"}
)
.outputVariables( 'total, value, number' )
.constraint( 'favorite, symbol' )
.method( 'favorite -> symbol', id )
.method( 'favorite -> favorite', id )
.constraint( 'symbol, value' )
.method( 'symbol -> value', fetch_stock_value )
.method( 'symbol -> symbol', id )
.constraint( 'value, number, total' )
.method( 'value, number -> total',
function( value, number ) { return value * number; }
)
.method( 'total, value -> number',
function( total, value ) { return total / value; }
)
.method( 'total, number -> value',
function( total, number ) { return total / number; }
)
.end();
methodの後に処理を書いて、その返却値を書いていくイメージです。
デモとして経費の計算を行うWebアプリケーションがあります。
外部のサービスからデータを取ってくるもの。非同期にも対応しています。
Canvasを使った描画。ドラッグにも対応しています。
HotDrinkを使うことでWebアプリケーションをMVVMに対応した形で開発しやすくなるでしょう。また、MVVMをフレームワークを通して学ぶという点においてもHotDrinkが使えるはずです。
HotDrinkはJavaScript製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。
HotDrink Overview HotDrink/hotdrink: JavaScript MVVM library with support for multi-way dependencies and generic, rich UI behaviors.