ExtJSで楽しくRIA業務アプリ開発

今回から数回にわたってExtJSの導入方法を紹介したいと思います。

最低限必要なもの

・ブラウザ (Firefox1.5以降, Safari3以降, Opera9以降、IE6以降、公式にサポートは書かれていませんがChromeでも動きます。)
・エディタ (sus4社内では主にvimを使っています。)

あるとよいもの
Firebug(Firefox アドオン、http://getfirebug.com/jp.html)
JSLint(構文チェッカー、http://www.jslint.com/)

Firebugはほとんど必須のようなものですが、Opera DragonflyやChromeの開発ツールでも可能ですが,Firebugを使った方が無難な気がします。
この解説では基本的に開発環境はFirefox 3.5 と Firebugを使うものとします。

Ext JSのダウンロード
ext.com,もしくはextjs.co.jpからExtJSをダウンロードします。extjs.co.jpの方からダウンロードするとします。extjs.co.jpからの方が道順が簡単なのでextjs.co.jpへアクセスします。

バナーをクリックして、Ext JS3.0のサンプルがあるサイトへ移動します。

extjs.co.jpトップページ

右のリストにある「ダウンロード」のリンクをクリックするとダウンロードページへ移動します。

ダウンロードへ移動する

ここでExt JSの各バージョンをダウンロードできます。ここでは3.0.0をダウンロードすることにします。

バージョンを選ぶ

ダウンロードが完了したら、zipファイルを展開します。

Ext JS 3.0.0 zip

zipファイルの中身はこんな感じです。

この中のdocとexamplesはアプリケーションに必要ないので、普段は削除してかまいませんが、今回は残しておくことにします。

サンプルを実行する
examplesの中にあるindex.htmlをブラウザで開いてみると、ExtJSを使ったサンプルを見ることができます。extjs.co.jpにあるものとほとんど同じですが、このサンプルのファイルはすべてローカルにあるので、自分でソースコードを変えて実験をしてみることができます。

これでひとまずExtJSの開発環境は整いました。サンプルをいろいろ触ってみてExtJSを体感してみてください。

次回ははExtJSでHello, Worldを作ってみます。