July 10, 2007

Web標準の日々のJavaScriptトラックの、7/16（月）のJ6というセッションで、僕がしゃべるのですが、気がついたら、同じ時間に行われるサブリンさん＆神森さんペアのセッションと、上ノ郷谷さんのセッションが満席になっていました。

強敵がすでに「あがり」になってしまっていますが、せっかくなので事前にちょっとこの件についてのお話を。

7/16のJ6というJavaScriptのセッションで、僕がしゃべります。しゃべる内容はAdobeのSpry Widgetについてです。

Spry Widgetは、Adobeが出しているSpry Framework for AjaxというJavaScriptのフレームワークの一部品です。Spry Frameworkは、Adobeの目指す「誰でも簡単に使えるように」という方向性において、「デザイナー向けフレームワーク」と言われています。

しかし、その売り文句はDreamWeaver CS3が、Spry Frameworkを組み込んだ形で、GUI上で簡単にSpryの設定ができるよ！というのを含めて完結するものなので、「デザイナー向け」とはあくまでもDreamweaverありきの考え方と考えるべきで、中身は普通によくできたJavaScriptライブラリです。

（よくできたJavaScriptライブラリと言えば、みんな大好きDreameaverが出力するロールオーバーのJavascriptも汎用性が高くかなりイケてますね。mmなんとかって関数名の奴。Spryはあれの発展版です。）

エンジニアとして、このソースを見る場合には、Adobeが開発した再利用可能なJavaScriptライブラリとして、Yahoo! Widgetやprototype.jsなどと同じように使いやすいライブラリとして注目すべきだと思っています。

僕はこのフレームワークを、昨年の「Web標準の日」で始めてちゃんと見ました。名前はなんとなく知っていたものの具体的にチェックはできてなかったところAdobeの林岳里さんのセッションで、実際のデモを見て、あぁ今度、カラメルに使お！と即決して実際に使った次第です。

そういう意味では、「Web標準の日」様々でSpryを学ぶことができて、その一年後の「Web標準の日々」にて、自分がSpry Wigetについて話ができるってのは、非常にうれしい限りです。

なおSpry Widgetはフォームの入力検査を自動化してくれるライブラリで、簡単なHTMLの記述で、入力フォームの入力チェックを自動処理してくれるものです。

カラメルのユーザー登録や、カラメルが持つソーシャルブックマーク機能のお気に入り登録などの入力フォームで、Spry Widgetを使っています。

prototype.jsと共存できるので、僕の場合はAjaxなどの処理はprototype.jsで行い、入力フォームのUIの制御にだけSpryを使うのが僕の好きな使い方です。

講演の中では、JavaScriptを知らないと全然わからないようなマニアックな話はしません。しかし、Spry Widgetは、そのまま使うには足りない部分もあるので、そこの改善方法については詳しく話をしたいと思います。

明日から本当に仕事に使える、改造方法も提供したいと思いますので、そこだけはソースコードを含めてお見せします。

できれば改造したソースも提供したほうが良いとは思っていてblogで提供したいと思っています。もし間に合わなくても、講義を聴いていただきエッセンスだけを吸収していただくだけでも、十分、改造できるレベルの話なので、そういうのをお話したいと思います。

この講義をお聞きいただけたら、仕事でSpry Widgetの採用を検討する際に、メリット、デメリット含めて取捨選択の判断ができるようになると思います。汎用性の高いJavaScirptで、効率的な開発を実現するものですから、Spry Widgetを理解した上で、多くの人に使ってもらえたらなぁと思っています。

講演の対象者は、ひょっとしたら僕と同じようにフレームワークやライブラリなどの技術選択を検討するような人、、、ディレクター、SE、プログラマーさんなのかもしれません。

でも、Spryは「デザイナー向けフレームワーク」ですから、JavaScriptを使って仕事をしていきたいデザイナーさん向けに資料は作っています。Dreamweaver CS3と組み合わせると、こんなに楽なんだよって部分は是非、お見せしたいです。

いずれにせよ、ものすごく簡単すぎて、手応えがないプレゼンにはしたくないので、嫁レビューを行って、うまくバランスを取り、いろんな属性の人に見応えのある話ができたらいいなって思っています。

－・−

今回の講義に関連のあるF's Garageの書き込み

・デザイナーの作るHTMLを壊したくないWeb開発者のために

↑は結構、極論なのですのが、Spryを即決したベースとなる思想はここにあります。2003年に仕事でテンプレートエンジンを作ろうと企画している最中に書いたエントリーです。

・spryWidgetメモ

↑読みにくくてすいませんが、タイトル通りメモということで(^^;

－・−

今回発表するプレゼン資料の中から、構成を抜粋します。

■Spry Widgetとは？
・そもそも「Widget」とは？
・HTMLに組み込む方法
・Dreamwevaer CS3によるデモ

■入力チェックについて考えてみる。
・「デザイナー向けフレームワーク」の罠
・入力チェックって何？
・入力チェックの分類

■SpryWidgetで足りない機能
・Spry Widget拡張計画
・Inside Spry Widget（Spry Widgetが何やってるか？という仕組みについて解説）

■Spry Widgetって実際どうよ？
〜採用を検討するときに知っておくべき事〜

なお明日は、「爆発するソーシャルメディア」というセミナーで、Movatwitter絡みでちょっとだけ出演してきます。