javascriptテンプレートエンジンまとめ
ちょっとjavascriptのテンプレートエンジンの調査・・・
ご紹介とテンプレートのコーディングスタイル:
<html>
<body>
<% for ( i=0; i<5; i++ ) { %>
Hello World <br>
<% } %>
</body>
</html>
<textarea id="cart_jst" style="display:none;">
Hello ${customer.first} ${customer.last}.<br/>
Your shopping cart has ${products.length} item(s):
<table>
<tr><td>Name</td><td>Description</td>
<td>Price</td><td>Quantity & Alert</td></tr>
{for p in products}
<tr><td>${p.name|capitalize}</td><td>${p.desc}</td>
<td>$${p.price}</td><td>${p.quantity} : ${p.alert|default:""|capitalize}</td>
</tr>
{forelse}
<tr><td colspan="4">No products in your cart.</tr>
{/for}
</table>
{if customer.level == "gold"}
We love you! Please check out our Gold Customer specials!
{else}
Become a Gold Customer by buying more stuff here.
{/if}
</textarea>
<table border="1"> <tr><th>name</th><th>author</th></tr> <tr title="@foreach line1 [/table1]"> <td>[/line1/name]</td> <td>[/line1/author]</td> </tr> </table>
<p tid="time">It's <em tid="hours">hour</em> :
<em tid="minutes">minute/em> :
<em tid="seconds">second</em> now.</p>
<textarea id="template" style="display:none">
<% context.list.each(function(pair){%>
The value of <%= pair.name %> is: <%= pair.value%>
<% }) %>
</textarea>
選びがたいですが、
simple is best. ということでlyase_viewでちょっと遊んでみようと思います。
2006/07/29 追記
lyase_view使って遊んで見た結果、こんなものできました。
javascriptテンプレートエンジン使用例:
・旬レシピ
・Flickr Color Selectr
両方とも、サーバのperlスクリプトから返ってきたJSONをevalしてlyase_viewのテンプレートでhtmlコードをレンダリングしている感じです。
viewを、htmlとjavascriptコードとjavascriptテンプレートとに分離して実装している点が気持ち悪いです..
ちょっとしたwebアプリは誰にでも書けるようになっている今日この頃、
腕のあるソフトウェアエンジニアは、
よりチャレンジングな、○○フレームワークの開発、に挑んでいるようですね。
一昔前までは、手書きでhtmlを書いていたのが、
今ではhtmlをなにも意識しなくてもブログを更新できる。
紙がどんな素材でできているかなんて一般人は気にする必要はない。
活版印刷が普及した時、なにが起こったっけ?
歴史は繰り返す。
キリスト教が普及したな・・・
