新課教育合作學(xué)校
北京國軟教育“Html5+代碼演練”實(shí)戰(zhàn)訓(xùn)練營培訓(xùn)課程
北京國軟教育“Html5+代碼演練”實(shí)戰(zhàn)訓(xùn)練營培訓(xùn)課程
【課程簡介】
在成為美國海軍陸戰(zhàn)隊的正式成員之前，所有的“菜鳥”都必須來到位于加州圣迭戈和南卡羅來那州的巴利斯島兩個訓(xùn)練基地之一，經(jīng)歷瘋狂而嚴(yán)格的訓(xùn)練考核。只有那些掌握了超乎尋常技藝的勇士才有機(jī)會成為這個世界上最酷的、最訓(xùn)練有素的精銳部隊——美國海軍陸戰(zhàn)隊中的一員。
歡迎來到BOOTCAMP。在這里，我們將全周期生活在JavaScript實(shí)戰(zhàn)編碼的環(huán)境下完成Web技能的學(xué)習(xí)。一起穿越JavaScript開發(fā)中危險重重的“編程陷阱”和“開發(fā)沼澤”，才能完成Web開發(fā)周期“實(shí)戰(zhàn)拉練”項目的各項測試和考核。要想完成這項光榮的使命，我們必須：
1、熟練使用各種“生存工具”：如JavaScript調(diào)試工具、單元測試工具、合并與壓縮、IDE開發(fā)環(huán)境以及其插件的使用；
2、獨(dú)立搭建JS下的持續(xù)構(gòu)建開發(fā)環(huán)境；
3、掌握各種編程實(shí)踐的技法。這包括：TDD、BDD...各種實(shí)戰(zhàn)開發(fā)方法；
4、本能將Kanban與XP的敏捷實(shí)踐作為基礎(chǔ)實(shí)踐；
5、構(gòu)建自己的Web MVC前后端開發(fā)框架；
6、全周期生活在JavaScript實(shí)戰(zhàn)編碼的環(huán)境下完成各種開發(fā)任務(wù)...
每2名成員會形成一個團(tuán)隊。每一個團(tuán)隊都會有自己指定的“作戰(zhàn)區(qū)域”和“武器裝備”。我們的目標(biāo)是穿越那些危險重重的“編程陷阱”和“開發(fā)沼澤”，讓那些真正來自線的開發(fā)實(shí)踐成為我們身體中的一部分，變成我們的標(biāo)識。從而成為世界上最酷的精銳部隊--“美國海軍陸戰(zhàn)隊”中的一員。
全程采用“Hackathon”學(xué)習(xí)模式，完全拋棄“Hello，World”式的毛毛蟲案例，遠(yuǎn)離華而無實(shí)的PPT講義。
我們來自開發(fā)實(shí)戰(zhàn)的最前線！
我們！
需要的是“近身肉搏”、“拳拳到肉”的地獄式訓(xùn)練！
只有。對，只有那些堅持到最后的勇士才配的上我們的榮譽(yù)：
我們是“Web Programming Ninja”。我們奮斗在軟件開發(fā)最前線！
【課程詳細(xì)大綱】
【篇:技藝篇】
主題 |
知識點(diǎn) |
Code Kata! （代碼演練） |
快速啟動 (Quick Start) |
1、要有前：Html + CSS + JavaScript 2、要有后：NodeJS + Express +MongoDB + Socket.IO 3、要有推和拉：Http + Socket +Ajax + JSON |
CodeKata： 為什么Html5 很優(yōu)秀 ?更酷的API ?更自然的語義表達(dá) ?對移動設(shè)備的原生支持 ?無限多的可能... CodeKata：在實(shí)戰(zhàn)中學(xué)習(xí) Html5(Ninja_V0.1) ?Html5結(jié)構(gòu)元素構(gòu)建應(yīng)用骨架 ?美輪美奐的CSS3 ?擁抱流式布局 ?重構(gòu)Html CodeKata：必須響應(yīng)式設(shè) 計(Ninja_V0.2) ?智能手機(jī)很重要 ?響應(yīng)式設(shè)計的定義 ?視調(diào)試 ?響應(yīng)式設(shè)計中的Html5 ?解決跨瀏覽器的問題 ?瑞式軍刀 ?讓BootStrap幫助我們 CodeKata：讓富媒體幫助用戶認(rèn)識我們(Ninja_V0.3) ?制作Audio和Video說明 ?解碼器 ?Canvas ?瀏覽器的支持情況 ?向37Signals學(xué)習(xí) CodeKata：使用遠(yuǎn)程數(shù)據(jù) (Ninja_V0.4) ?NodeJS Server ?Restful ?Ajax調(diào)用 ?跨文檔消息通信 ?XmlHttpRequestLevel 2 ?結(jié)構(gòu)化數(shù)據(jù) CodeKata：推送？是的， 推送(Ninja_V0.5) ?NodeJS WebSocket服務(wù)器 ?使用Html5 WebSockets API ?線程處理 ?Web Workers |
不一樣的Web前 端開發(fā) |
1、裝配腦袋(JavaScript是不一樣的) 2、JavaScript是函數(shù)式語言 3、 一切都是函數(shù) 4、 函數(shù)的幾種調(diào)用方式 5、內(nèi)存作用域 6、回調(diào)與閉包 7、閉包的內(nèi)存問題 8、JavaScript模式(函數(shù)篇) 9、DOM編程 10、封裝DOM操作 11、仿寫(jQuery|ExtJS)的方法 12、DOM天生就慢(DOM的訪問與修改) |
|
美輪美奐的前端 交互 |
1、JavaScript是無阻塞的 2、setTimeout && setInterval 3、初涉NodeJS 4、為什么是JavaScript 5、事件 6、UX設(shè)計 7、你必須知道的一些CSS知識 8、使用JavaScript控制CSS 9、仿寫(jQuery|ExtJS)的動畫交互效果 10、DOM天生就慢(DOM的重繪與重排) |
|
面向?qū)ο蟮?/span> JavaScript：解 構(gòu)知名開源框架 |
1、面向?qū)ο蟮腏avaScript 2、字面量 3、new 4、對象的封裝 5、JSON 6、數(shù)據(jù)的內(nèi)存處理 7、命名空間 8、JavaScript模式(對象篇) 9、組織團(tuán)隊的JavaScript代碼 10、仿寫(jQuery|ExtJS|Dojo)的可運(yùn)行骨架 11、模塊化加載與執(zhí)行 |
|
JavaScript的繼 承體系：解構(gòu)知 名開源框架 |
1、JavaScript是原型式語言 2、Prototype 3、__proto__ 4、原型鏈 5、原型鏈的內(nèi)存問題 6、各位，見證奇跡的時刻到了 (JavaScript魔法) 7、語法糖 8、如何(jQuery|ExtJS|Dojo)插件 9、jQuery源碼骨架 10、Dojo源碼骨架 |
【第二篇:框架篇】
主題 |
知識點(diǎn) |
Code Kata! （代碼演練） |
MV[*]模式 |
1、MVC 2、MVP 3、MVVM |
CodeKata：應(yīng)用JavaScript 框架(Ninja_V0.6) ?應(yīng)用AngularJS框架 ?使用數(shù)據(jù)綁定 ?定制模塊 ?路由、視圖 ?依賴注入 CodeKata：要有框架，自己的!(Ninja_V0.7) ?對比Backbone.JS ?My.JS ?MVC:M ?MVC:V ?路由 ?單頁面程序的問題 CodeKata：改用模塊化加載(Ninja_V0.8) ?模塊化加載技術(shù)選型 ?延遲的腳本 ?動態(tài)加載腳本 ?異步腳本注入 ?LazyLoad? or LABjs ?RequireJS? or Sea.js |
MV[*]框架的構(gòu)成部分 |
1、模板與數(shù)據(jù)綁定 2、路由 3、模塊 4、依賴注入 5、輔助工具 |
|
JavaScript框架選型 |
1、不要重復(fù)發(fā)明輪子 2、幾個重要的技術(shù)類庫和框架選型： 3、Prototype、jQuery、Dojo與Ext 4、Backbone與 Spine.js 5、Angular、Knockout與Batman 6、Ember |
|
構(gòu)建自己的JavaScript框架 |
1、類 2、繼承 3、多態(tài) 4、命名空間 5、框架的異常處理 6、單頁面處理的問題 7、JavaScript模式(框架篇) 8、構(gòu)建自己的JavaScript框架 |
|
前端模塊機(jī)制 |
1、動態(tài)加載腳本 2、異步腳本注入 3、推薦的無阻塞模式 4、CommonJS與AMD 5、RequireJS & Sea.js |
|
后端模塊機(jī)制 |
1、CommonJS規(guī)范與NodeJS 2、NodeJS的核心模塊實(shí)現(xiàn) 3、包與NPM 4、Express + MongoDB + Socket.IO 5、模塊組織管理 6、發(fā)布模塊 7、前后端共用模塊 |
【第三篇:工程實(shí)踐篇】
主題 |
知識點(diǎn) |
Code Kata! （代碼演練） |
編寫可維護(hù)的JavaScript代碼 |
1、JavaScript的精華與糟粕 2、JavaScript編程風(fēng)格與JSHint 3、JavaScript模式(編程實(shí)踐) 4、使用CoffeeScript 5、Clean Code與重構(gòu) |
CodeKata：搭建 JavaScript下的持續(xù)交 付環(huán)境 |
JS下的單元測試 |
1、測試框架 2、TDD與BDD風(fēng)格 3、異步下的測試 4、Mock 5、測試覆蓋率 6、生成測試報告 |
|
自動化構(gòu)建 |
1、目錄結(jié)構(gòu) 2、模塊構(gòu)建 3、配置文件 4、校驗 5、文件合并與加工 6、精簡壓縮 7、文檔化 8、測試 9、組裝在一起 |
|
Grunt |
1、Build 2、Clean 3、Stylus 4、Concat 5、Uglify 6、JsHint 7、Mocha 8、Doc 9、Jade 10、Watch 11、Plugins |