本文基于Ext JS 4.2.1版本
UI組件基礎
學習ExtJS就是學習組件的使用。ExtJS4對框架進行了重構，其中最重要的就是形成了一個結構及層次分明的組件體系，由這些組件形成了Ext的控件。
ExtJs4的組件體系中有將近100種組件，而這些組件又可以大致分為四大類，即容器類組件、工具欄及菜單欄組件、表單及元素組件、其他組件。
theme主題
ExtJs4引入了全新的主題系統，采用Sass和Compass技術，提供了標準的主題模板，通過對主題模板的簡單定制就可以創造出豐富多彩的各種主題。

Sass和Compass概述
Sass
Sass樣式表語言是CSS的一個擴展，為CSS提供了變量、內嵌規則、混入（mixins）、選擇器繼承等特性，在最新的Sass3中100%兼容CSS3，語法文件也升級為SCSS（Sassy CSS），每一個有效的CSS3文件也是有效的SCSS文件，這種兼容性降低了學習成本，開發人員可以平穩的由CSS過渡到Sass的開發。
Sass樣式表語言為CSS級聯樣式表提供了編程的能力，現在我們可以在Sass中定義變量在不同的樣式中引用甚至進行計算，定義混入（mixins）在不同的地方進行復用，這些能力都是CSS所不具有的，經過編譯之后Sass會輸出標準的CSS文件在不同的瀏覽器中使用。

Sass特性：
混入(Mixins)――class中的class；
參數混入――可以傳遞參數的class，就像函數一樣；
嵌套規則――Class中嵌套class，從而減少重復的代碼；
運算――CSS中用上數學；
顏色功能――可以編輯顏色；
名字空間(namespace)――分組樣式，從而可以被調用；
作用域――局部修改樣式；
JavaScript 賦值――在CSS中使用JavaScript表達式賦值。
Sass的詳細介紹和說明可見：http://sass-lang.com/
Compass
Compass是一個基于Ruby的、開源的、用于CSS創作的框架。它使用Sass樣式表語言，可以非常容易和高效地構造樣式表，同時，Compass內置了大量Web開發中可重用的優秀模式，以便開發者使用。下面用一個簡單的等式來展示Compass所發揮的作用：
Compass = Sass樣式表語言 + 大量可重用的優秀CSS模式
Compass的詳細介紹和說明可見：http://compass-style.org/
準備工作(安裝運行環境)
安裝Ruby
使用SASS和Compass需要用到Ruby，可以到http://rubyinstaller.org/下載Ruby的安裝包，下載后的文件是“rubyinstaller-1.9.3-p429.exe”。
（注意，不要下載最新版Ruby2.0.0-p195，不然后面開發中會由于版本問題出錯。Ruby 1.9.3-p429就可以。）
雙擊運行，步驟如下：
注意將安裝目錄上的3個選項都選上。
點擊完成。
至此，Ruby就安裝完成了。
在開始菜單Ruby程序組下，單擊“Start Command Prompt with Ruby”。

進入Ruby的命令行界面。輸入
ruby