這是本人第一次寫部落格教程，沒什麼經驗，文筆也不是很好，寫這教程一方面為了鞏固自己這段時間的學習成果，一方面幫助大家解決問題，歡迎大家多提建議，指出問題。接下來我們就開始我們的sencha touch開發之旅了。

　　首先，我們開始搭建sencha touch的開發環境，我這講的環境搭建主要是針對windows平臺的：

　　1.選擇一款能夠相容並除錯sencha touch的瀏覽器：

　　sencha touch之前是針對webkit核心進行設計的，所以chrome或safari瀏覽器可以很好的展現基於sencha touch的webapp,不過sencha touch的最新版本也提供了對ie10和ie11的支援，所以在開始開發之前，確保你的系統上已經安裝了上述瀏覽器之一（我這裡演示使用的是chrome瀏覽器，除去firefox的firebug工具外，我最喜歡的就是chrome的開發者工具了，不僅可以檢視dom元素，除錯js，還能實時監控，cpu使用率，觸發事件，記憶體佔用等，是js開發的強力工具）；

　　2.下載sencha touch的sdk工具包：

　　http://www.sencha.com/products/touch/download/，這是官方的下載地址，你可以輸入你的郵箱下載免費的商業版本（Free Commercial Version），系統會將下載連結傳送到你的郵箱中

　　你也可以點選這個連結 http://cdn.sencha.com/touch/sencha-touch-2.3.1-gpl.zip，下載官方的gpl(General Public License)版本,gpl版本比免費商業版本多了sencha chart，不過基於gpl協議的專案需要對外公開自己的原始碼

　　在下載sdk包的同時，我們可以把sencha touch的官方離線文件也下載下來，

　　這裡是sencha touch各個版本的官方文件，點選版本號可以檢視線上文件，如果需要下載離線文件，點選版本號後面的zip即可；

　　3.sencha cmd 工具的下載及環境配置

　　sencha cmd 是官方提供的一款功能強大的命令列工具，使用它你可以自由地建立sencha touch的app專案，對你專案中的js及css檔案進行壓縮，以及將專案打包成相應移動平臺的安裝程式，對於使用了sencha touch 的native api的，sencha cmd 會在打包安裝程式中使用sencha packaging自動整合相關裝置的本地函式入口，相當好用，在後面的教程中我們會介紹如何使用它進行專案開發，我們先將cmd的安裝程式包下載下來，點選連結

　　由於cmd工具是用java寫的，所以它的執行需要java 1.7版本環境以及ruby（用來編譯專案的css）的支援，所以我們還需要安裝java的jdk和ruby：

　　3.1 java jdk的安裝：

　　註明：目前java官網安裝的java程式已經不帶jdk了，所以大家可以到oracle的官網去下載java的jdk，

　　，一般情況下該站點會根據你的系統自動判斷你需要下載的版本，如果下載的版本跟你的系統不匹配，你可以點選下面的連結http://www.java.com/zh_CN/download/manual.jsp，選擇與你係統匹配的jdk包進行下載，下載完成後進行安裝即可，

　　安裝完jdk包後，我們還有件重要的事情要做，就是配置jdk的環境變數，這裡僅針對windows平臺進行講解

　　xp的系統右擊我的電腦 ==》屬性 ==》環境變數，

　　win7的系統可以在開始選單中右擊計算機==>屬性==》高階系統設定==》環境變數，進入環境變數設定介面，如圖

　　在“系統變數”中，設定3項屬性，JAVA_HOME,PATH,CLASSPATH(大小寫無所謂),若已存在則點選“編輯”，不存在則點選“新建”:  

　　JAVA_HOME指明JDK安裝路徑，就是剛才安裝時所選擇的路徑C:\Program Files\Java\jdk1.6.0_21，

Path項下新增：;%JAVA_HOME%\bin; %JAVA_HOME%\jre\bin，注意前面用分號隔開，（當你在命令列介面執行java指令的時候，作業系統會到path下去查詢這個執行檔案）

在CLASSPATH項新增：.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar (要加.表示當前路徑)

（classpath是類檔案路徑，當你執行java xxx指令時，系統會根據這個classpath設定的路徑去查詢java的class檔案）

　這樣我們的環境變數就配置完畢了，點選開始==》執行，cmd，進入命令列工具，輸入java -version,這時會出現java的當前版本號，代表環境配置成功；

　　接著我們再鍵入sencha，同樣也會顯示sencha cmd的版本資訊，如圖:

　　3.2 ruby的安裝:

　　對於我們用sencha cmd建立sencha touch的專案來說，ruby並不是必須的，不過在打包專案的時候我們必須用到它，cmd在打包壓縮專案的時候會使用ruby來編譯專案的css檔案，如果沒有安裝ruby，那麼打包將會報錯失敗，所以在這裡我們將ruby一起安裝起來，

　　點選下面的連結http://rubyinstaller.org/downloads/進行下載安裝，這裡我們只介紹windows系統下的情況，cmd 4.0以下的版本對ruby 2.0版本不相容，不過在官方文件航上看到4.0版本好像沒這個問題了，具體沒測試過，我這裡使用的還是ruby 1.9.3版本的安裝程式，

　　點選開始安裝，安裝的時候可以選擇英文或者日文，聽說ruby是日本人寫的，

　　安裝的過程中記得勾選下面的項，自動配置ruby的環境變數，

　　安裝成功，我們測試下ruby是否安裝成功：

　　點選開始==》執行==》鍵入cmd，在命令列工具中輸入ruby -v，如圖，會顯示ruby的版本資訊

　　自此我們的ruby安裝成功

　　4.web服務端環境

　　萬事俱備，只欠東風，最後一個必備的工作就是配置我們的服務端環境，雖然我是做java的，不過專案的服務端一直都是c#寫的，所以我這裡用的是iis伺服器，使用iis服務的話，要給iis服務配置MiME,新增 application/x-json，如果你做的webapp準備釋出web版本的話，還需要新增text/cache-manifest，這個是用來設定webapp離線快取的，tomcat，apache都不用做額外的設定

　　5.開發工具（IDE）的選擇

 　　開發工具根據個人的喜好來使用，我使用的是傳說中的js神奇webstorm，大愛，呵呵，你可以根據自己的使用習慣來選擇ide，vs，eclipse，aptana，也是不錯的選擇，

　　sencha touch官方還推出了自己的開發工具Sencha Architect，官網上可以直接下載，不過是收費的，免費試用30天，可以破解無限試用，該工具可以對檢視直接進行拖拽，所見即所得

　　其中只有controller部分的程式碼可以進行編輯，並且沒有程式碼提示功能跟格式化功能，如果大家有需要，以後可以專門開篇教程介紹這款工具的使用

　　完成以上的工作，我們的準備工作就完成了，下一節我們將開始建立我們的第一個sencha touch專案