スパイスラボ神部です。
実は長年の Macromedia 製品ユーザ(正確には Adobe 製品になっちゃいましたが)なので、サイト管理や Web サービス開発を DreamWeaver で行っています。その流れで OpenSocial アプリ開発も DreamWeaver でやっていたんですが、GadgetXML の編集にはいまいち向いていなかったりするんですよね。なぜなら、CDATA 内に書いた JavaScript はコードとして認識されないため。
しかし、ここでちょっとコストをかけて外部 JavaScript 化することできっちり DreamWeaver の JavaScript のコードアシスト機能などが働いてくれます。普通はテキストエディタなり、OSDE(OpenSocial Development Environment )などを使ったりしているのでかなり異端であるとは思いますが、折角10万以上するQA(品質評価)レベルの高いパッケージを使っているのですから、それを上手に使って開発効率を上げたいですよね。いい機会なので、簡単ながらそんな DreamWeaver × JavaScript のノウハウをまとめてみます。
-DreamWeaverが好きだ! - Favorites!
OpenSocial アプリで JavaScript 開発をする効率的な方法
まず大事なのは、自分のメインコードを外部 JavaScript 化することです。opensocial-jquery を使っているのであればそれと同様に自分のコードを src 属性で読み込めばOKです。
さて、別ファイル化した JavaScript コードを開いてみましょう。Gadget XML の CDATA 内に書いた場合と違い、ちゃんと色分けされて表示され、Ctrl+Space によるコード補完も利きます。
さらに嬉しいことに、Postal Search APIs & Solutions ブログ: Dreamweaver で jQuery API のコード補完ができる jQuery API extension for Dreamweaver で紹介されている jQuery API extension for Dreamweaver
を使うと、OpenSocial アプリケーションの開発に便利な jQuery の記述もラクになるようです。これはぜひ導入したいですね!
キャッシュに注意
リソースを外部化した場合は、キャッシュの設定に注意です。
-Tender Surrender » OpenSocialガジェット開発で注意すべきキャッシュ機能
開発中は、すべてのキャッシュをオフにしておくといいかもですね。
-天使やカイザーと呼ばれて: Content Rewriter Feature (0.9)
<Optional feature="content-rewrite">
<Param name="exclude-url">*</Param>
</Optional>
CS4についてちょこっと
とはいえ、DreamWeaver CS3 のコードインスペクタやデバッグ機能は、CSS においても JavaScript においても Firebug やテキストエディタで書いている人の先進性からは大きく遅れています(かなり変化が激しい上にまだベストのやりかたについて模索中な言語やそれを取り巻く仕様ですからしょうがないとは思いますが)。
CS4 では Live View という機能でかなり prototype.js や jQuery を使ったコードの開発がラクになりそうな感じですね。
-Adobe Edge: 2008年7月 Dreamweaver CS4 パブリックベータ 第2回 ライブでJavaScriptの動作と動的HTMLソースを確認可能
CS5 くらいでよいので、ガジェット開発や OSDE のような、ローカル OpenSocial アプリ開発についても対応を検討してもらえたら、すごく嬉しいですね。
ということで、楽しい開発ライフを!
参考情報
CS4 を比較対象とした、JavaScript 環境の比較なんてのをみつけました。
-JavaScriptエディタを比較してみた « きんくまデザイン|デザインを生かしたプログラミング
DreamWeaver はいいかもしれないけど、やっぱ高くて買えない!という場合、Aptana(アプタナ)という Eclipse ベースの開発環境もあるそうです。
-Aptana Studio : Dreamweaverの代わりにもなる強力なWeb統合開発環境 » 窓の杜とベクターフリーソフトのダウンロード
DreamWeaver にはプロジェクトという考え方がないので、プロジェクト内コード補完や内容読み取りコード補完が全く利かないというのは、開発環境として考えると確かにダメダメかもしれませんね。でも、Web サイトの要素はそれだけではないので、バランスを考えると DreamWeaver になってしまうこともあります。お金さえ出せば(リテラシーレベルの差異も吸収して)みんなが同じ環境をそろえられるという点も、重要といえば重要だったりします。
-Dreamweaver -Joomler!.net - Decided on Joomla!
-ひでぶろぐ PHP全般続 dreamweaver と cakephp
-【連載】今からはじめるAIRプログラミング (2) AIRプログラミングに適した開発環境 | エンタープライズ | マイコミジャーナル
-ASCII.jp:JavaScript開発にもHTML制作にも使える無料ツール
-色分け、自動補完機能などを備えたJavascriptで出来た高機能なコードエディター『CodePress』 | POP*POP
-Adobe - Dreamweaver CS4 tutorial : JavaScript DOM Spryを効率的にコーディングするコードヒント機能
-DreamweaverでCSSのコードヒントをカスタマイズする。 | ツール | フロントエンド | Webソリューション | 株式会社オロ
-Adobe Dreamweaver CS4 with Fireworks CS4 for Windows & Macintosh (ゼロからのステップアップ!)が好き! - ILOVEIT(β)
関連記事


