執行變臉式應用

[任務]

用筋斗雲前端框架建立一個H5應用專案myproject，在瀏覽器執行起來。

先從github上下載開源的筋斗雲前端框架及示例應用：https://github.com/skyshore2001/jdcloud-m

建議安裝git工具直接下載，便於以後更新，例如直接建立H5應用專案叫myproject：

git clone https://github.com/skyshore2001/jdcloud-m.git myproject

如果github訪問困難，也可以用這個git倉庫： http://dacatec.com/git/jdcloud-m.git

下載後，假定myproject是我們的專案目錄。其中，子目錄server是H5應用目錄，開發主要集中在這裡。tool是用於優化和釋出的工具，之後在站點上線優化時介紹。

設定WEB伺服器（如Apache/nginx/IIS等），新增虛擬目錄myproject, 指向myproject/server目錄，這時，就可以直接執行起前端應用：

http://localhost/myproject/

在開發環境下，建議配置WEB伺服器，將所有檔案都設定為不快取(輸出HTTP頭Cache-Control: no-cache)，避免修改檔案後仍然顯示舊內容。 測試時建議使用chrome瀏覽器，按F12開啟開發者模式，點左上角的手機模式模擬(toggle device toolbar)或按Ctrl-Shift-M，模擬手機上的執行效果應用。

在這個示例應用中，使用者可以建立訂單、檢視訂單列表和訂單詳情，檢視個人資訊等，分別在各個邏輯頁中展現，邏輯頁跳轉切換時不會重新整理整個網頁，這就是典型的變臉式應用。

變臉式應用與後端的互動完全是是業務資料，後端不傳輸任何網頁、網頁模板或前端樣式。這裡由於還沒有連線後端，示例中使用的資料均為模擬後端介面返回的資料。

筋斗雲前端支援模擬介面返回資料，這在前端開發時非常有用。檔案mockdata.js中即是應用使用到的介面模擬，下面章節裡將會詳細介紹。

在server目錄下，lib目錄下的js/css檔案都屬於框架使用的檔案，不宜隨意修改，其中app_fw.js是筋斗雲前端框架的核心部分。

page目錄是預設的邏輯頁目錄，比如首頁、登入頁、訂單列表等邏輯頁的html和js檔案都放在這裡。

cordova目錄是用於製作原生手機app時使用的。筋斗雲框架支援全平臺應用，即一套H5程式碼，可同時製作安卓應用、蘋果應用、微信微站等。