前端培訓

 

歡迎來到BOOTCAMP。在這裏，咱們將全週期生活在JavaScript實戰編碼的環境下完成Web技能的學習。一塊兒穿越JavaScript開發中危險重重的「編程陷阱」和「開發沼澤」，才能完成Web開發週期「實戰拉練」項目的各項測試和考覈。要想完成這項光榮的使命，咱們必須：

• 熟練使用各類「生存工具」：如JavaScript調試工具、單元測試工具、合併與壓縮、IDE開發環境以及其插件的使用;

• 獨立搭建JS下的持續構建開發環境；

• 掌握各類編程實踐的技法。這包括：TDD、BDD...各類實戰開發方法；

• 本能將Kanban與XP的敏捷實踐做爲基礎實踐；

• 構建本身的Web MVC先後端開發框架；

• 全週期生活在JavaScript實戰編碼的環境下完成各類開發任務...

每2名成員會造成一個團隊。每個團隊都會有本身指定的「做戰區域」和「武器裝備」。咱們的終極目標是穿越那些危險重重的「編程陷阱」和「開發沼澤」，讓那些真正來自第一線的開發實踐成爲咱們身體中的一部分，變成咱們的標識。從而成爲世界上最酷的精銳部隊--「美國海軍陸戰隊」中的一員。

咱們來自開發實戰第一線，咱們是「Web Programming Ninja」。

開發工具

開發環境	客戶端:Chrome 服務端:NodeJS 安裝NodeJS後，在cmd命令行下使用npm install -g xxx 安裝插件： npm install -g node-inspector Jasmine Mocha
開發工具	Sublime Text 開啓Sublime插件安裝： 按Ctrl+`調出console,粘貼如下代碼到底部命令行並回車： import urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp) if not os.path.exists(ipp) else None;open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ‘,'%20')).read()) 重啓Sublime Text 2。 若是在Perferences->package settings中看到package control這一項，則安裝成功。 安裝插件： 按下Ctrl+Shift+P調出命令面板 輸入install 調出 Install Package 選項並回車，而後在列表中選中要安裝的插件。 須要安裝的插件： Emmet Alignment JsFormat Prefixr JsHint
引用類庫	Bootstrap 經常使用的JS庫：libs
相關資料	課前預習：Adobe Kata 更多資料：Green Tea

課程大綱

主題	知識點	Code Kata （代碼演練）
MV[*]模式	• MVC • MVP • MVVM	CodeKata：應用JavaScript框架 • 應用AngularJS框架 • 使用數據綁定 • 定製模塊 • 路由、視圖 • 依賴注入 CodeKata：要有框架，本身的! • 對比Backbone.JS • My.JS • MVC:M • MVC:V • 路由 • 單頁面程序的問題 CodeKata：改用模塊化加載 • 模塊化加載技術選型 • 延遲的腳本 • 動態加載腳本 • 異步腳本注入 • LazyLoad? or LABjs • RequireJS? or Sea.js CodeKata：搭建JavaScript下的持續交付環境
MV[*]框架的構成部分	• 模板與數據綁定 • 路由 • 模塊 • 依賴注入 • 輔助工具
JavaScript框架選型	• 不要重複發明輪子 • 幾個重要的技術類庫和框架選型： • Prototype、jQuery、Dojo與Ext • Backbone與 Spine.js • Angular、Knockout與Batman • Ember
構建本身的JavaScript框架	• 類 • 繼承 • 多態 • 命名空間 • 框架的異常處理 • 單頁面處理的問題 • JavaScript模式(框架篇) • 構建本身的JavaScript框架
前端模塊機制	• 動態加載腳本 • 異步腳本注入 • 推薦的無阻塞模式 • CommonJS與AMD • RequireJS&Sea.js
後端模塊機制	• CommonJS規範與NodeJS • NodeJS的核心模塊實現 • 包與NPM • Express + MongoDB + Socket.IO • 模塊組織管理 • 發佈模塊 • 先後端共用模塊
編寫可維護的JavaScript代碼	• JavaScript的精華與糟粕 • JavaScript編程風格與JSHint • JavaScript模式(編程實踐) • 使用CoffeeScript • Clean Code與重構
JS下的單元測試	• 測試框架 • TDD與BDD風格 • 異步下的測試 • Mock • 測試覆蓋率 • 生成測試報告
自動化構建	• 目錄結構 • 模塊構建 • 配置文件 • 校驗 • 文件合併與加工 • 精簡壓縮 • 文檔化 • 自動化測試 • 組裝在一塊兒
Grunt	• Build • Clean • Stylus • Concat • Uglify • JsHint • Mocha • Doc • Jade • Watch • Plugins