TOPシステム開発【これならわかる!JavaScript/Ajax】Ajaxライブラリ入門> 第3回:いま注目のExt JS (1/3)




【これならわかる!JavaScript/Ajax】Ajaxライブラリ入門

【これならわかる!JavaScript/Ajax】
Ajaxライブラリ入門

第3回:いま注目のExt JS

著者:林 俊之

公開日:2008/5/16(金)

はてなブックマークの登録数

美麗かつ高機能なUIコンポーネントが満載のExt JS
 Ext JSは日本では実際の利用例はまだ少ないですが、今後使われていくことが増えるであろう注目のAjaxライブラリの1つです。

 Adobe Airのベータ版の時にサンプルアプリケーションとしてHTMLベースでできたRSSリーダー「Fresh」のデモがありましたが、実はそれはExt JSで作られていました。

 Ext JSは当初、YUI(The Yahoo! User Interface Library)用の拡張ユーティリティ「yui-ext」としてJack Slocum氏により開発がスタートしました。その後、YUIのほかにベースライブラリとしてprototype.jsやjQueryもサポートするようになり、名前が「Ext JS」となり、さらに現在では独自のベースライブラリも用意され、ほかのライブラリに依存せずに、Ext JS単体でも開発できるようになっています。

 Ext JSの最大の特徴は、美麗かつ超高機能なUIコンポーネントが充実していることです(図1)。アプリケーションを機能させる上での基本UIコンポーネントはすべてそろっていると言えるでしょう。

 また、デザインテーマも持っており、デフォルトのEXT-Blueのほか、Gray、Vistaなどのテーマも含まれています。ユーザによって作成されたスキンも公開されています。

 オフィシャルサイトにあるサンプルを見ると、Ext JSのすごさが体感できると思いますので、ぜひご覧になってみてください。

 最新のExt JSのバージョンはver 2.1で、さらにExt JS3.0のアナウンスも行われました。サンプルの画像しか見ることができませんが、Office2007で導入されたリボンインターフェースのようなルックアンドフィールを実現することができるようです。
図1:Ext JSのUIコンポーネントの特徴
(画像をクリックすると別ウィンドウに拡大図を表示します)

早速ダウンロードしてみよう
 Ext JSはこちらからダウンロードできます。ダウンロードされるファイルは27MBとかなりの容量ですが、豊富なサンプルファイル、ドキュメントなどが充実していますので気軽に試すことができます。

 ダウンロードしたファイルの「ext-2.1/examples」の中に大量のサンプルファイルが入っています。基本的にローカルでも動くサンプルがほとんどですが、いくつかサーバ上でないと動作しないものもあります。

 Ext JSのライセンスには、LGPLのオープンソースライセンスと商用ライセンスのデュアルライセンスになっています。商用ライセンスに関してはこちらをご覧ください。有料サポートも存在するようです。 次のページ


*商用ライセンスに関してのリンクを「http://extjs.com/products/license.php」に訂正しました。(2008/05/20)
Ext JSは2008年4月21日にオープンソースライセンスをLGPLからGPL v3に変更があり、コードの変更を行った場合、変更したコードをExt communityに提供する必要があります。

「コード変更と見なされるケース」
・Ext JavaScriptの変更、CSSファイルの変更
・Extクラスの拡張や既存のメソッドのオーバーライド
・Ext APIの変更

「見なされないケース」
・新しいthemeのcssを作成する
・多言語対応のパックを作成する
・Extクラスのデフォルトプロパティの上書き

詳しくはこちらをご確認ください。


林 俊之
著者プロフィール
林 俊之
So-net、MSNを経て現在gooを運営するNTTレゾナントでデザインエンジニアとして勤務。UI設計、HTMLコーディング、JavaScript開発を主軸に仕事中。iGoogleガジェットコンテストで「インプレスR&D インターネットマガジン賞」を受賞。

この記事の評価をお聞かせください
ボタンをクリックしますとウインドウが開きます。
ご意見、ご要望にお応えします! インプレスIT INSIDE

INDEX
第3回:いま注目のExt JS
-> 美麗かつ高機能なUIコンポーネントが満載のExt JS
  定番のGridを使ってみる
  Viewportで画面全体をレイアウトする
【これならわかる!JavaScript/Ajax】Ajaxライブラリ入門
第1回 Ajaxの基礎知識
第2回 Ajaxライブラリの変遷
第3回 いま注目のExt JS
第4回 ミニRSSリーダーを作ってみよう!
第5回 Ajax開発の未来
関連記事
即実践!HTML+CSS
Webデザイナは知っていた

Think IT 過去人気記事

注目おすすめ情報

Think IT人気ライター BEST 5