Ajax (Asynchronous JavaScript + XML) プログラミング手法がますます Web アプリケーションの開発において威力を振るうようになってきた今、新しい開発者たちが毎日 Ajax 開発の世界に足を踏み入れています。しかし、それぞれの開発者が使ってきた開発手法と Ajax は本質的に異なります。そんな開発者に対して、この連載の第 1 回では、IBM® の Ajax 開発者からなる専門家チームの Ajax 開発リソースが使用している Ajax 開発のチートシートを紹介します。筆者らは、Ajax 開発立ち上げ時の経験を元に、効果的な Ajax 開発への近道となる実用的な情報を提供します。

Ajax とは、JavaScript、カスケーディング・スタイル・シート (CSS)、HTML、XMLHttpRequest オブジェクト、そして文書オブジェクト・モデル (DOM) を組み合わせた Web アプリケーション・クライアント手法のことです (それぞれの標準についての詳細は、「参考文献」を参照)。ブラウザー上で動作する Ajax アプリケーションは非同期で Web サーバーと通信し、部分的なページ更新のみを行います。Ajax 手法を利用することで、リッチなブラウザー・ベースのユーザー・エクスペリエンスを実現できます。

Ajax の旅に出発する際には、さまざまな言語、標準、ツール、ライブラリーを理解していなければなりません。最初はどうやって各種のオプションをナビゲートして開発環境を組み立てるか、途方に暮れてしまうこともあるでしょう。そこで、筆者らは、Ajax 開発立ち上げ時の経験を元に、Ajax の旅の途中で起こり得る一般的な問題やもどかしい問題を回避するお手伝いをします。

Ajax のワゴンに乗る

Ajax の目的は、クリックするたびにページが更新されるという Web サイトのユーザー・エクスペリエンスを、対話型で反応の早いデスクトップ・アプリケーションのルック・アンド・フィールで一新させることです。Ajax を使えば、ユーザーはページをリロードしなくても済むと同時に、次のコンテンツが表示されるまで待つ必要もありません。こうしたすべてのことは素晴らしいと思えるかもしれませんが、それをどのように実現するのでしょう? この質問に答えるには、Ajax の背後にある技術について多少知っておくと役立ちます。

Ajax は以下の Web 技術と標準を集めたもので、クライアントのマシンを使ってアプリケーションの出力を表示できるだけでなく、そのロジックの重要な部分を裏で実行することができます。

• ハイパーテキスト・マークアップ言語 (HTML): 最終的にユーザーに表示されるコンテンツを定義します。
• カスケーディング・スタイル・シート (CSS): 表示されるコンテンツのスタイル (または装飾) を定義します。
• 文書オブジェクト・モデル (DOM): 表示されるコンテンツをブラウザーが JavaScript スクリプトに公開するために使用する API。スクリプトは DOM を使用して、ユーザーに表示される前にそのコンテンツを動的に変更することができます。
• XMLHttpRequest オブジェクト: JavaScript スクリプトから呼び出され、ブラウザーとサーバー間の非同期の対話を容易に実現します。
• JavaScript: ブラウザー内部で実行されるプログラミング言語で、その他すべての Ajax 構成要素を結合します。スクリプトはブラウザー内部で発生したイベント (ボタンのクリックなど) をリッスンし、XMLHttpRequest によるサーバーへのコールバックでイベントに応答した後、返された結果を基に DOM ツリーを変更します。

上記の技術はすべて、Ajax プログラムを実行するプラットフォームとして機能するユーザーの Web ブラウザー内部で実行されます。

Ajax を使用する際に理解しておかなければならないのは、Ajax の構成要素となっている技術は標準ベースとは言え、ある程度はブラウザーに固有だということです。つまり、ブラウザーによっては、同じアプリケーションでもその動作が異なる可能性があります。しかしユーザーに特定のブラウザーしか使わせないようにすることは不可能で、また、ユーザーのブラウザーが CSS または DOM に対応しないことも考えられるため、クライアントを無視することも賢い考えではありません。したがって、アプリケーションの作成者自身が、各種ブラウザー間の違いを理解している必要があります。

有能な Ajax 開発者になるためには、以下のことが必要です。

• Ajax 開発の基礎となっている技術を把握すること。
• 使用可能なランタイム・プラットフォームおよび Web ブラウザーを理解すること。
• Ajax アプリケーションの開発中に使用するさまざまな言語をサポートする IDE を使用すること。
• 各種の環境および言語に対応したデバッガーとアプリケーション・テスト・ツールを使用できるようにしておくこと。

上に戻る

情報源

優れた Ajax チュートリアルの 1 つとして挙げられるのは、developerWorks に掲載されている連載「Ajax をマスターする」(Brett McLaughlin 著) です。この連載では、読者に Ajax プログラミングの知識がほとんどないことを前提として、さまざまな Ajax 関連の技術について説明しています。Web アーキテクチャーをより深く理解したいのであれば、REST (Representational State Transfer) にも慣れ親しむ必要があります。その第一歩としては記事、「How to Create a REST Protocol」(「参考文献」を参照) がお勧めです。

連載「Ajax をマスターする」をひと通り読み終えて自ら開発を始めてみると、参照情報が必要になってきます。その際には、W3 Schools (「参考文献」を参照) が Ajax のコア技術 (JavaScript、CSS、HTML、DOM、XML など) に関するオンライン参照情報になります。

Mozilla Firefox ブラウザーをお使いの場合は、DevEdge サイドバー (「参考文献」を参照) を使用してください。これらのサイドバーには個々の Ajax 技術を定義する標準への索引が含まれているので、リファレンス・ガイドとして使用できます。

Ajax コミュニティーの動向を探るには、Ajaxian ブログ (「参考文献」を参照) をサブスクライブしてください。

上に戻る

ランタイム環境としてのブラウザー

Web ブラウザーは Ajax デプロイメント環境であるだけでなく、デバッグを行うための環境でもあります。DOM ツリー・ビューアーやデバッガーなどのデバッグ支援を使えば、大抵のブラウザーを拡張することができます。次のセクションでは、よく使われているブラウザーとして以下の 3 つのブラウザーの概要を説明します。

• Microsoft® Internet Explorer (IE)
• Firefox
• Safari

Internet Explorer

IE は相変わらず大多数のユーザーが好むブラウザーです。IE6 は熟成したブラウザーで、市場占有率も抜群です。IE6 では多くの CSS および DOM 機能がサポートされていなかったり、あるいは独自仕様で提供されています。IE6 を使用している開発者は、レポートされている以下の問題に突き当たることがあります。

• JavaScript インタープリターの処理速度が遅く、標準実装が一貫していない。
• 透過的 PNG サポートが欠如している。
• DOM イベント。イベント名が Firefox と IE とで一致しない場合がある。一部のイベントの呼び出し順が異なり、IE と Firefox とで同様のイベント・オブジェクトでも属性のセットが異なる場合がある。この問題については、「Migrate apps from Internet Explorer to Mozilla」(「参考文献」を参照) で詳しく説明しています。
• CSS 属性 (minimum/maximum、height)、セレクターなどが実装されていない。

上記のような問題はあるものの、ユーザーの大多数が使用このブラウザーであることを常に前提にしておかなければなりません。また、IE6 の特異性に対する改善策をもたらす /IE7/ (「参考文献」を参照) などの各種ライブラリーを使ってみるのも一案です。

IE7 は IE6 に比べ、タブ・サポートをはじめとする目に見える改善が多数加えられています。開発者にとっては目に見えない改善のほうが重要ですが、その点でも、IE7 では JavaScript インタープリターのパフォーマンスが向上し、IE6 での不備 (CSS など) の多くが修正されています。そのため、大抵の標準準拠の Ajax アプリケーションはほんの少々修正を加えるだけで IE7 上で実行できるはずです。

IE のデバッグ支援

IE でアプリケーションをデバッグするには、以下のツールを使用できます。

• IE Developer Toolbar: IE 環境 (キャッシュ、クッキー) のより詳細な制御、DOM ツリーの探索、そして要素スタイルの探索と操作を可能にします。アプリケーションで生成されたページを分析するときに役立つツールです (IE Developer Toolbar は Microsoft からダウンロードできます。リンクについては「参考文献」を参照してください)。
• Microsoft Script Debugger: Microsoft Office 付属のツール (Microsoft からダウンロードできます。「参考文献」を参照) で、JavaScript コードでのブレークポイントの設定、変数のウォッチを行える他、一般的に通常のデバッグ・ルーチンを実行できます。デバッグの際には、毎回デバッグ・セッションの前に IE Developer Toolbar でキャッシュを無効にすることが推奨されています。この設定を行わないと、キャッシュされたバージョンのコードをデバッグすることになります。

IE 関連のブラウザー

maxthon などの「新規」ブラウザーを作成するには IE ブラウザー・エンジン、Trident を使用できます。ここでは「新規」と言っていますが、開発者の観点からすると、ブラウザーの重要な属性 (ブラウザーの Ajax サポートなど) は同じままです (Trident についての詳細は、「参考文献」を参照)。

Mozilla Firefox

今日までにリリースされた Firefox バージョンはいくつかありますが、ここで説明の対象としているのは Firefox 2.0 のみです。Firefox は開発者や上級ユーザーの間で広く普及しています。UNIX® タイプのオペレーティング・システムに最適なこのブラウザーはオープン・ソースで、その普及率は IE に次いで第 2 位となっています。

Firefox には高速 JavaScript インタープリターがあり、さまざまな Web 標準が最適に実装されています。Ajax との相性がいいことから、大抵の Ajax 開発には Firefox を使用することを強くお勧めします。一般的に、Ajax 開発者の多くはアプリケーション開発を Firefox で開始してから他のブラウザーにマイグレートしています。

Firefox のデバッグ支援

Firefox には強力なオープン拡張メカニズムがあり、コミュニティーはこのメカニズムを使って大量の Web 開発支援を作成しましたが、そのなかでも群を抜いて重要なのが Firebug (「参考文献」を参照) です (Firebug の機能についての詳細は、「Ajax Debugging with Firebug」を読んでください)。Firebug は以下の機能を持つ一体型拡張です。

• ブレークポイント、変数監視、およびコードのステップ実行による JavaScript コードのデバッグ
• ネットワーク・トラフィックのレビュー
• DOM ツリーと各種要素の CSS のレビューおよび調整

Firebug 1.0 の長所と柔軟性は Ajax 開発において大きな意義があり、Firefox を推奨開発ブラウザーとして使用する十分な理由となっています。

Firefox 関連のブラウザー

Firefox レイアウト・エンジンである Mozilla Gecko (「参考文献」を参照) は、Camino をはじめとする複数のブラウザー内で使用されています。対応する Gecko バージョンを搭載したブラウザーには、Firefox と同じ機能性が備わります。

Safari

Safari は MacOSX 付属のブラウザーです (リリース 3 の時点では、Windows® でも動作しています)。Firefox および IE7 に比べて Safari の速さは際立っていますが、標準サポートに欠けています (ただし、最新の WebKit ビルドでは改善が見られます。WebKit については、次のセクションで詳しく説明します)。また、Safari の開発者コミュニティーは Firefox や IE 関連のコミュニティーよりも断然小規模です。そのため、Web では Safari に関する情報が乏しく、Safari で十分にテストされていないライブラリーも多数あります。

Safari のデバッグ支援

Safari ブラウザー・エンジンは、WebKit (「参考文献」を参照) というオープン・ソース・プロジェクトで開発されています。Safari でアプリケーションをデバッグするには、WebKit ビルドを使用することをお勧めします。このビルドに含まれているものは以下のとおりです。

• CSS および DOM インスペクターを備え、余計な装備を取り除いたブラウザー
• Drosera。 JavaScript デバッガーである Drosera ではアプリケーションのデバッグは行えますが、Firebug と比較すると機能が限られています。

アプリケーションのテストをどうしても Safari で行うというのであれば、Safari Debug メニューをオンにしてください。こうすると、DOM ツリー、CSS、キャッシュなどを検査することができます。

Safari 関連のブラウザー

WebKit は複数のブラウザーで使用されています。なかでも有名なのは OmniWeb です。

上に戻る

Ajax IDE およびツール

新しい Ajax アプリケーションを開発してみると、Ajax 関連のすべての技術をサポートし、簡単で快適な開発環境と UI を提供する IDE を使用する上での利点が明らかになってきます。Ajax IDE の選択基準となる機能には、以下があります。

• オートコンプリート、色による強調表示、エラー通知などの機能を備えた構文指向編集 (HTML、CSS、JavaScript、および DOM 用)
• さまざまな技術に関する関連資料
• 統合 JavaScript デバッガー
• ネットワーク監視
• DOM イントロスペクション
• フレームワーク統合

IDE の購入をお考えかもしれませんが、Eclipse とその関連プラグインが提供する Ajax IDE には十分な機能があり、しかもオープン・ソース・ベースなので無料でダウンロードできます。このセクションでは、アドオンを含め、Eclipse をベースとした以下の Ajax IDE を紹介します。

• Web ツールキットを備えた Eclipse
• Eclipse ATF
• Aptana

このセクションでは JsUnit ユニット・テスト・パッケージについても説明します。

Web ツールキットを備えた Eclipse

サーバー・サイド Java™ を担当する Java 開発者にとって、Eclipse Web ツールキットは基本的な Ajax 開発を始めるのに手軽で簡単な手段になります。Eclipse の Web ツール (「参考文献」を参照) を追加すると、Web 成果物を開発するための基本作業環境が整い、HTML、CSS、および JavaScript ファイル用のエディターや編集ツールが手に入ります。

Eclipse Web ツール環境は Ajax 開発だけに限られてはいません。むしろサーバー・サイドに重点を置いて Web アプリケーション開発をサポートするため、構文強調表示や基本コード補完などのコア機能を提供します。Ajax 固有の開発タスクであるデバッグ機能や DOM 操作は行えません。

Eclipse ATF

Eclipse ATF (Ajax Toolkit Framework) 環境 (「参考文献」を参照) をインストールして Eclipse Web ツールキットと組み合わせると、Ajax 開発のあらゆる側面でのニーズをサポートする強力な環境になります。ATF が提供する機能には、例えば以下のものがあります。

• DOM ブラウザーおよび CSS ランタイム・エディター
• JavaScript デバッガー (Mozilla XUL ランナーを利用)
• ネットワーク・トラフィックの監視
• ライブラリー・プロファイルによる共通ライブラリーの簡単なライブラリー統合
• JSLint (「参考文献」を参照) との統合による JavaScript 検証の実行

このツールキットならではの価値ある特徴は、統合 XUL ランナーでアプリケーションの実行、テスト、検査を行える点です。

Aptana

Aptana (「参考文献」を参照) は Eclipse をベースとした非常に便利なオープン・ソースの環境で、無料でダウンロードできます。Ajax 開発を対象としたツールを備えた ATF とは異なり、Aptana は Web 2.0 アプリケーションの開発を対象とする IDE です。RDT (Ruby Development Toolkit) を買収した Aptana は、Ruby と Eclipse の統合を実現しています。

Aptana は完全な Eclipse 環境としてダウンロードすることも (ATF オプションに比べ、遥かに手間が省けます)、すでにセットアップしてある Eclipse 環境に追加するプラグインのセットとしてダウンロードすることもできます。

Aptana 環境の使い勝手の良さとしては、以下の点を挙げられます。

• 高品質のユーザーズ・ガイドと技術参考資料
• JavaScript コード分析、DOM 統合、そしてブラウザー互換性情報を完備した Ajax 成果物のための編集環境
• 外部 Firefox ブラウザーを使用したデバッグ機能
• 基本 Ajax ライブラリー統合
• 潜在的エラーにマークを付けるコード検証システム
• ファイルシステム上のどの場所でも編集できる機能、および FTP を使ったリモート・ファイルの編集機能

場合によっては、ATF をインストールして学習するよりも簡単な Aptana が開発のニーズにふさわしいソリューションとなります。

JsUnit

JsUnit (「参考文献」を参照) は JavaScript ベースのユニット・テスト・フレームワークで、JUnit (一般的な Java ユニット・テスト・ライブラリー) を JavaScript に移植して作成されたものです。JsUnit は JavaScript 関数に対するテスト・ケースの定義、そしてブラウザー環境内でのテスト・ケースの実行を同時にサポートします。開発したコードで一貫性のあるユニット・テストを行う方法をお探しの場合、JsUnit は有益なフレームワークになるはずです。

上に戻る

Ajax フレームワーク

最近では、面倒になる可能性がある Ajax 開発タスクを楽にすることを目的とした多くの Ajax 開発フレームワークが登場しています。このセクションでは、新しく生まれたオープン・ソース Ajax フレームワークをいくつか紹介します。これらのフレームワークは以下の方法でジョブを簡単なものにします。

• リッチ Web ユーザー・インターフェース (UI) のビルディング・ブロックとして機能するウィジェットの集合を提供
• 非同期データ操作と転送プロトコルを単純化
• あらゆるブラウザー間の非互換性を軽減
• 一般的な Ajax 開発タスク (なかでも DOM 操作、イベント登録など) を単純化する便利な JavaScript メソッドを提供

利用可能な Ajax フレームワークは無数にあるため、この記事には収めきれません。そのため、Prototype、script.aculo.us、Dojo、Rico のみを取り上げて詳細を説明します。使用できる Ajax フレームワークとそれぞれの使用方法についての包括的なリストは、Ajaxian.com の 2006年度調査 (リンクについては「参考文献」を参照) に記載されています。

Prototype

Prototype (「参考文献」を参照) は、Ajax プログラミングの単純化に役立つ有力な関数を導入する JavaScript ライブラリーです。このライブラリー自体は Ajax フレームワークとは言えないかもしれませんが、他のいくつかのフレームワーク (script.aculo.us、Moo.fx2、Rico など) の中核となっています。Prototype は以下をサポートします。

• 基本 DOM 操作
• Ajax 呼び出し
• 多数のユーティリティー関数
• 入力フィールドとフォームの作業

Sam Stephenson によって開発された Prototype は Ruby プログラミング・スタイルから発想を得たもので、現在は MIT (Massachusetts Institute of Technology) ライセンス (「参考文献」を参照) に基づくオープン・ソース・プロジェクトとなっています。

Prototype のシナリオ例

Prototype を使って Ajax プログラミングを単純化するシナリオの一例として、定期的に更新して最新のニュースを表示するセクションがページに必要だとします。この場合、タイマーを設定して 1 分おきに updateNews() メソッドを呼び出します。updateNews() メソッド内では Prototype Ajax.Updater を使用して、最新ニュースのコンテンツに対する非同期要求を実行します。受け取った結果は、div 要素である most-recent-news の HTML コンテンツとして挿入されます。リスト 1 は、Prototype が提供する多くの有力な関数のうちの一例です。

                                
<html>
   <head>
      <script src="js/prototype.js" type="text/javascript"></script>
      <script type="text/javascript">
          function updateNews() {
              new Ajax.Updater(
                  {success: 'most-recent-news'},
                  'http://myserver/news/recent-news'
                );
              setTimeout("updateNews()",60000);
          }
      </script>
    </head>
    <body onload="updateNews()">
        <h1>Recent News</h1>
        <div id="most-recent-news"></div>
    </body>
</html>
            

Prototype を使用しなかったとしたら、このシナリオ例にはもっとたくさんの詳細を記述する必要があり、遥かに多くのコーディング作業が必要になっていたでしょう。

Script.aculo.us

Script.aculo.us (「参考文献」を参照) は、MIT ライセンスに基づくオープン・ソース・プロジェクトです。Prototype をベースにビルドされた Script.aculo.us は Ruby on Rails に組み込まれています。Script.aculo.us はリッチ Web-UI Rails アプリケーションを開発する際によく使われるフレームワークですが、他のあらゆるサーバー・サイド技術とも使用できます。Script.aculo.us はシン・フレームワークとして説明されてはいるものの、強力な動画機能ならびに以下の特徴があります。

• JavaScript ベースの DOM ビルダーを使った簡単な DOM 操作
• ドラッグ・アンド・ドロップのサポート
• 少数のコントロールとウィジェット (オートコンプリート、スライダー、インプレース編集など)

リスト 2 は、Script.aculo.us の強力な動画効果の使用例です。この例では、テキスト行をクリックすると、その行が画面から徐々にフェードアウトします。

                                
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js" type="text/javascript"></script>
...
<div onclick="new Effect.Fade(this)">
    Click here to see me fade out!
</div></html>
            

Dojo Toolkit

Dojo Toolkit (「参考文献」を参照) は包括的な Ajax フレームワークで、多種多様なニーズを満たします。Dojo には以下のものが用意されています。

• クロスブラウザーの JavaScript 用 stdlib
• DOM 操作
• ダウンロードの時間とサイズを最適化するパッケージング・システム
• 豊富で拡張可能なウィジェットのセット
• ドラッグ・アンド・ドロップのサポート
• 動画のサポート
• 極めて豊富なサーバー・サイド統合ライブラリー

Dojo の際立ったセールス・ポイントの 1 つは、ウィジェットが拡張可能で、単純なウィジェットから複雑なウィジェットを作成できることです。したがって、ほとんどの Ajax ライブラリーおよびフレームワークとは異なり、Dojo は特定のプログラミング・モデルを促し、それに従えば、デスクトップ GUI プログラミングのように Web インターフェースを設計することができます。

Dojo はオープン・ソース・プロジェクトとして Dojo Foundation が開発を進めていて、Academic Free License (「参考文献」を参照) のもと提供されます。Dojo は非常に活気のあるプロジェクトで、IBM、Sun Microsystems、AOL などの大企業によってサポートされています。

図 1 は、Dojo を使ったデモ版メール・アプリケーションのスクリーン・ショットです。これを見るとわかるように、Dojo はツリー、テーブル、そしてその他多くのウィジェットを提供して、デスクトップのような UI を作成できるようにしています。さらに、これらのウィジェット間での対話動作も単純化します。

Rico フレームワーク

Rico は、Apache 2.0 ライセンスに基づいて提供されるオープン・ソースの Ajax フレームワークです (Rico の Web サイトへのリンク、Apache 2.0 ライセンスの説明へのリンクについては、「参考文献」を参照)。占有スペースは比較的小さいながらも、このフレームワークにはかなりの価値が詰まっています。以下は、Rico の際立った特徴の一部です。

• テンプレートを使用した拡張 DOM 操作
• アコーディオン、LiveGrid、プルダウンなどの多彩なウィジェット
• ドラッグ・アンド・ドロップのサポート
• シンプルな動画
• 角の丸め、色の管理など、外観を対象としたユーティリティー
• 簡単なサーバー・サイド統合

Rico に組み込まれている関数は Dojo フレームワークより少ないものの、利用可能な関数が UI 開発のニーズを満たすのであれば、Rico の小さな占有スペースが強みになるはずです。特に、Rico の LiveGrid ウィジェットは動的テーブルを作成するための共通タスクを大幅に単純化します。

上に戻る

初心者のためのロードマップ - 今すぐ始めてください

Ajax 開発に加わる準備ができたら、以下のロードマップにリストしたステップに従って開始してください (注: このロードマップでは、IDE には Aptana を、Ajax フレームワークには Dojo を使用していますが、それぞれのニーズに合わせて構成を変えても構いません)。

• Mozilla Firefox 2.0 をダウンロードして、Firebug プラグインをインストールします。
• Aptana をダウンロードしてインストールします。
• 「Ajax をマスターする」のチュートリアルに従って Aptana でコード・サンプルを作成します。サンプルが作成できたら、Firebug でデバッグします。
• Dojo Toolkit をダウンロードし、Dojo の「Hello World」チュートリアル (「参考文献」を参照) に従います。

上に戻る

今回のまとめと次のステップ

今の時点では、この記事で読んだ Ajax アプリケーション開発ツールの情報を消化しきれないかもしれませんが、上記に記載した初心者のためのロードマップに従っていれば、実際的な Ajax アプリケーションを多少経験したことになります。次のステップはと言うと、Ajax 関連の技術についての詳細を読んで、使用する Ajax フレームワークを選び、その情報を調べてナレッジ・ベースを構築することです。HTML、JavaScript、CSS についての資料は大量に出回っています (「参考文献」に、出発点として最適な W3 School チュートリアルへのリンクを記載しています)。また、Ajax Patterns サイト (「参考文献」を参照) にも目を通してください。もちろん、実際に取り掛かってみるのが一番の近道です。自分なりのアプリケーションを作成して、試してみてください。

この連載の次回の記事では、単純な Dojo ベースのブログ・リーダーを開発して、今回学んだ Ajax 開発の知識を実践に移してみます。まだ Ajax の旅に加っていないとしても、すぐに参加することになるはずです。次回をお楽しみに。

参考文献

学ぶために

• developerWorks Ajax resource center には、入門の手引きとなる Ajax 資料が満載されています。ここに、JavaScript、カスケーディング・スタイル・シート (CSS)、HTML、XMLHttpRequest オブジェクト、文書オブジェクト・モデル (DOM) の各標準についての説明へのリンクも記載されています。
  
  
• W3Schools は、すべてのコア Ajax 技術 (JavaScript、CSS、HTML、DOM、XML など) に関するオンライン情報源です。
  
  
• /IE7/ ライブラリーを調べてください。このライブラリーは IE6 の特異性に対する改善策をもたらします。
  
  
• Mozilla developers Centerには、Ajax の基礎となっているさまざまな技術に関する包括的資料が記載されています。
  
  
• Mozilla DevEdge Sidebarsサイトでは、Firefox ユーザー向けに Ajax 技術仕様への索引付きアクセスを用意しています。
  
  
• developerWorks に掲載されている連載「Ajax をマスターする」は、Ajax アプリケーションの開発入門です。
  
  
• 「How to Create a REST Protocol」は、REST に関する記事としてお勧めです。
  
  
• W3Schoolsには、Ajax 技術に関する簡潔で要点を抑えた情報と参照が記載されています。
  
  
• IE ブラウザー・エンジン、Tridentについての詳細を調べてください。
  
  
• Firebugの詳細を学んでください。
  
  
• Firebug の機能についての詳細は、「Ajax Debugging with Firebug」を読んでください。
  
  
• Firefox レイアウト・エンジン、Mozilla Geckoについて調べてください。
  
  
• Safari ブラウザー・エンジンは、WebKitという名前のオープン・ソース・プロジェクトで開発されています。WebKit の詳細を学んでください。
  
  
• 利用可能な Ajax フレームワークとそれぞれの使用方法を網羅したリストは、‘Ajaxian.com 2006 Survey Resultsに記載されています。
  
  
• MIT (Massachusetts Institute of Technology) ライセンスの詳細を調べてください。
  
  
• Academic Free Licenseの詳細を調べてください。
  
  
• Apache 2.0 ライセンスの詳細を調べてください。
  
  
• Script.aculo.usを読んでください。
  
  
• Dojo Toolkitは包括的な Ajax フレームワークで、多種多様なニーズを満たします。
  
  
• Dojo の「HelloWorld」チュートリアルを実行してください。
  
  
• オープン・ソースの Ajax フレームワーク、Ricoの詳細を学んでください。
  
  
• Ajax Patterns サイトに、一般的な Ajax デザイン・パターンのすべてがリストされています。
  
  
• Douglas Crockford の Web サイトでは、JavaScript と JSON についての興味深い記事を紹介しています。
  
  
• 「Migrate apps from Internet Explorer to Mozilla」(developerWorks、2005年7月) では、Firefox と IE との違いについて説明しています。
  
  
• Ajax という用語を作り出した「Ajax: A New Approach to Web Applications」を読んでください。
  
  

製品や技術を入手するために

• IE Developer Toolbar および Microsoft Script Debugger は、Microsoft Download Center からダウンロードしてください。
  
  
• Eclipse のWeb ツールを追加すると、Web 成果物を開発するための基本作業環境が整い、HTML、CSS、および JavaScript ファイル用のエディターや編集ツールが手に入ります。
  
  
• Eclipse ATF (Ajax Toolkit Framework)の詳細を学んでダウンロードしてください。
  
  
• Aptanaは Eclipse をベースとした便利なオープン・ソースの環境で、無料でダウンロードできます。
  
  
• JsUnit は JavaScript ベースのユニット・テスト・フレームワークで、JUnit (一般的な Java ユニット・テスト・ライブラリー) を JavaScript に移植して作成されたものです。
  
  
• JSLintは、JavaScript プログラムでの問題を探し出す JavaScript プログラムです。
  
  
• Prototypeは、Ajax プログラミングの簡易化に役立つ有力な関数を導入する JavaScript ライブラリーです。
  
  

議論するために

• Ajax コミュニティーの動向を探るには、Ajaxian ブログにサブスクライブしてください。
  
  

著者について

この記事を評価する

コメント

上に戻る

目次

• Ajax のワゴンに乗る
• 情報源
• ランタイム環境としてのブラウザー
• Ajax IDE およびツール
• Ajax フレームワーク
• 初心者のためのロードマップ - 今すぐ始めてください
• 今回のまとめと次のステップ
• 参考文献
• 著者について
• コメント