EXTJS5.x學習筆記第一天

EXTJS5.x學習筆記第一天

• 學習extjs的背景
• Day1
• 1，資源下載
• extjs sdk:
• sencha cmd:
• ruby:
• 2，生成程序框架
• 1，CMD命令建立文件夾
• 2，在文件夾下sencha -sdk extsdk安裝路徑 generate app 項目名稱 ./
• 3，編譯：sencha app build
• 4，運行：sencha web start
• 5，訪問 http://localhost:1841
• 3 ，工程目錄結構
• 生成的工程目錄結構是這個樣子
• 接下來我們來看一下一下index.html文件：源代碼
• 4，接下來我們看一下extjs的一個加載順序是怎樣子的
• 最重要的來啦，EXTJS項目的加載順序請大家一定要弄清楚

學習extjs的背景

交代一下學習背景吧，新入職公司用的是extjs5.x的前段框架，對於只用過bootstrap的而且是那種只會簡單操作的我真的是頭大，沒辦法只能在網上找相關的學習資料，所幸找到了一個叫Extjs5.0從入門到實戰開發信息管理系統****，接下來我將跟着這個視頻跟大家一起學習extjs框架
在這裏感謝行者老師做了這樣一個視頻，貌似是市面上唯一一個5.x版本的中文教學視頻，再次感謝，第一天的感覺講的挺通俗易懂的，我用的是1.5倍速觀看的因爲行者老師語速太慢啦哈哈哈

Day1

首先是extjs的核心文件分析

1，資源下載

extjs sdk:

• 下載地址
  • http://www.mycodes.net/169/7613.htm

sencha cmd:

• 下載地址
  • http://www.sencha.com/products/sencha-cmd/download,
• 安裝步驟，參考Sencha Cmd安裝筆記
  • https://www.baidu.com/link?url=TLjsUHG06ralgyPcXRkhScwGa3AFjgcjLHm8MgJmVCGOedjulKBDoTjCJCv6P-857Zt-sVXr03GUV3CfmLsVRq&wd=&eqid=ec1e75f70010a8f1000000065cd6b564

ruby:

• 下載地址
  • https://www.baidu.com/link?url=h6W3_mlskfN7MUXByc-zFcIf4Ly5PJ5rUfNrrQHKiLdE4KI9GQgtOumQbTBT-UIwgdeCPODoAy1H7AlbO1cV9mv4cZcQRzA1GGp2lstBrvW&wd=&eqid=b6c13d480003fbb3000000065cd6a31a
• 安裝步驟，參考window下安裝ruby與sass(附ruby)
  • https://blog.csdn.net/u014182411/article/details/77319639

2，生成程序框架

1，CMD命令建立文件夾

2，在文件夾下sencha -sdk extsdk安裝路徑 generate app 項目名稱 ./

3，編譯：sencha app build

4，運行：sencha web start

5，訪問 http://localhost:1841

3 ，工程目錄結構

生成的工程目錄結構是這個樣子

接下來我們來看一下一下index.html文件：源代碼

4，接下來我們看一下extjs的一個加載順序是怎樣子的

首先我們來看一下他的MVC:

MVVC:

最重要的來啦，EXTJS項目的加載順序請大家一定要弄清楚

附上