2月からプロジェクトが代わり、先輩方が進めているプロジェクトに入ることになりました。本格的な開発ということでほとんど戦力になれていないのが悔しいのですが、悔しさをバネに早く成長したいと思います。
そのプロジェクト内で Ext JS を仕事で使う場面があり、せっかくなので自宅でも遊ぼうと思って何か作ろうと考えていたのですが、"Feed Viewer" というサンプル（Ext JS 4.2.0 Sencha Docs へ）が面白そうだったので、ソースコードに色々手を加えています。
サンプルは固定リンクの RSS を取得し、それを一覧で表示するというものです。このサンプルに手を加えて、このブログのエントリーを簡単に一瞥できるようなアプリケーションにしたいな、と思っています。今のところはサンプルの機能はそのままに、新たにパネルを加えたり、SCSS から CSS を生成してみたりするなど、簡単なところからいじっている段階です。バージョンは Ext JS 4.2.0 です。
以下は、2013年7月1日現在のバージョンです。クリックで実際のアプリケーションのページへ飛びます。
Ext JS とは？
Wikipedia によると、以下のように解説されています：
Ext JS は、Ajax、DHTML、DOMスクリプティングといった技術を使ったインタラクティブなウェブアプリケーション（RIA）を構築するためのJavaScriptライブラリ。
Webアプリを作るための JavaScript フレームワーク、といったところでしょうか。非常に多くの機能を兼ね備えていて、海外はもとより、日本でも少しずつ利用され始めているようです。4系からは MVC(モデル・ビュー・コントローラー)スタイルでコードを管理できるということで、今のプロジェクトでも MVC スタイルでの開発を行っています。
ドキュメントを見て頂ければ分かるのですが非常に機能が豊富な一方、コーディングするのはかなり難しいようです。開発経験豊富な同じチームの先輩も難しいと言っていたので、さくっと使えるフレームワークではないことは確かです。Ext JS が提供するクラス間の関係が複雑な上、 JavaScript が動的型付けなのでコードサジェスチョンされないため、どのオブジェクトがどのメソッドを持っているのかを常にブラウザで実行して確認しながらコーディングしていく形になります。大規模開発に動的型付け言語は向いていないとよく言われますが、そこを吸収すべきフレームワークの Ext JS 自体もかなり癖がある…と言えばよいかもしれません。
デザインを当てる作業も思ったより大変でした。API リファレンスに載っていないディレクティブを使わないとタブ周りの細かい調整が出来ないことや、Ext JS 4.2.0 では compass コマンドでコンパイル出来ていたのが、4.2.1 では Sencha Cmd を利用しないといけなくなりました（ので、アップデートせずに 4.2.0 を使っています）。JavaScript 側もさることながら、CSS 側も出来ることが多い半面、作業は大変です。
慣れてしまえば共通機能を括りだしてクラス化して簡単に使い回せたり、Ext JS の魅力であるリッチなUIを堪能できます。ご興味ある方は是非サンプルをご覧ください。ちなみにこのページは API リファレンスも含んでいるのと、Ext JS の情報がウェブに少ないため、基本的にはこの API リファレンスを参照しながら開発をすることになります。
業務でも日々開発していますので、Tips などがあればご紹介したいと思います。
