ExtJSで大規模アプリケーション開発のコツ

なんだか、一切ゆっくりできない・・・小堤です。

さて、ExtJSで大規模アプリケーション開発のコツというタイトルにしましたが、なんの話か?というとですね。

最近、こんなことを言われることが増えてきたので。。。

「小堤さん、Ext JSである程度アプリケーション作れる様になってきましたが、ソースコードの量も多くなるしファイルも多くなる、しかも並行開発を行ったりバグを素早く見つけるための手法ってあるんですか?」

えっと、Ext JSのコンサル業務でここら辺をやらせてもらっております(笑)

20090502.jpg

でも、誰でもできるコツがあるので、参考になれば。

長くなりそうなんで、追記にします。continue押してね(笑)

 

1.ファイル配置

JSファイルの配置をどうしてますか?タダ並列にディレクトリにおいています?それとも思いつきでディレクトリきったり、それを名前空間にしちゃったりしてませんか?

別に読み込めればなんでもいいんですが、あくまで一例を。

継承元のクラスを参考にして、Ext JSのsourceディレクトリしたと同じ配置にする

です。

Ext.tree.TreePanelを継承していれば、treeディレクトリの下に入れるといった感じです。ある程度法則を決めておくだけで、継承したコンポーネントのクラスファイルを配置するときに迷わなくて済みます。

 

2.スタブ開発を重視する

Ext.Viewportを使うか使わないか。は別として。

ともかく、コンポーネント単位で開発を進めることです。

そのために、僕はアプリケーションクラスを用意して、最初に画像はっつけておきましたが、リンク集作ってコンポーネント単位でデバッグ&実装を行って結合テストしています。

普通のことなんですが、以外と1アプリケーション内で作っていく人が多いかも。

メニューを押してでてくるウィンドウの開発をしようと思ったら、毎回メニュー押さなくちゃだめじゃん・・・。ってことです。

 

コードは載せませんが、アプリケーションクラスを作成して、結合テスト(アプリケーション)の初期化処理をinitって名前にしてそこでViewportの生成とかやってます。

スタブアプリケーションは、さらに、その後にinitメソッドをオーバーライドするだけのクラスファイルを作って読み込みます。

こうすることで、スタブアプリケーションでオーバーライドされなければ全体の結合テスト、かぶせればスタブで部分開発ができます。

後は、それぞれのHTML作ってスタブアプリケーションクラスを切り替えればOK.

 

2.1 スタブでイベントが見える

最近よく使うんですが、オブジェクトリテラルで次々指定できるのはすごい便利なんですが、ごっちゃごっちゃに作っていくと、どこでイベントを発生させるべきなのか?が見えにくくなります。

そんなときは、スタブでコンポーネント単位で開発することによって上下関係(コンテナ構造)から切り離して開発していくことで、どこで何のイベントを発生させたり、リスンするべきかが見えやすくなります。

 

と、まぁ・・・だらだら書きましたが、まだまだいろいろテクニック的な話はあるんですが、ねむいのでこんな感じで(ぉ

 

かもしれない情報ですが、そう遠くない未来に「Ext JS本」だせるかもしれません。

 

 

 

ExtJSで大規模アプリケーション開発のコツ

コメントを残す