目前課程版本:6.5 升級(jí)時(shí)間:2019.06.01 查看詳細(xì)
課程設(shè)計(jì)之初就對(duì)目前企業(yè)中最流行的技術(shù)及知識(shí)點(diǎn)進(jìn)行過多次調(diào)研,整套課程設(shè)計(jì)完成后,又進(jìn)一步對(duì)課程中的技術(shù)點(diǎn)進(jìn)行了100+項(xiàng)的增加與優(yōu)化,全面覆蓋以 React.js、Vue.js 和 Angular 為首的三大框架,新的數(shù)據(jù)流方案、服務(wù)端渲染方案,當(dāng)下非常熱門的移動(dòng)端開發(fā)技術(shù):Flutter、React Native、微信小程序,讓學(xué)員能夠輕松應(yīng)對(duì)前端在不同領(lǐng)域、不同行業(yè)的技術(shù)難題。
學(xué)員的最終訴求就是能夠靈活運(yùn)用所學(xué)知識(shí)進(jìn)行企業(yè)項(xiàng)目開發(fā),所以真實(shí)的企業(yè)級(jí)項(xiàng)目是傳統(tǒng)培訓(xùn)中非常稀缺的。此次課程核心定位更接近真實(shí)企業(yè)需求,所以我們從項(xiàng)目選題開始全部以真實(shí)就業(yè)情況為出發(fā)點(diǎn),橫跨電商、金融、在線教育、社交、租房、旅游六大行業(yè),構(gòu)建真實(shí)企業(yè)級(jí)項(xiàng)目庫(kù),,通過超長(zhǎng)的項(xiàng)目課程培養(yǎng)學(xué)員在真實(shí)工作場(chǎng)景中攻克技術(shù)難題的的技術(shù)實(shí)戰(zhàn)能力,以及從容應(yīng)對(duì)不同企業(yè)需求的業(yè)務(wù)能力。
企業(yè)對(duì)于人才最核心的需求并不是對(duì)單純掌握某種應(yīng)用型技術(shù),而是希望開發(fā)者能夠通過自己的經(jīng)驗(yàn)幫助企業(yè)解決項(xiàng)目中隨時(shí)出現(xiàn)的問題。所以本次課程除了升級(jí)應(yīng)用型技術(shù)的相關(guān)課程,更多的還是提供海量商業(yè)項(xiàng)目解決方案,構(gòu)建超全的解決方案庫(kù),讓學(xué)員在日后的項(xiàng)目中可以靈活復(fù)用,做到企業(yè)有問題,我們有方案。
新增了學(xué)員自主團(tuán)隊(duì)開發(fā)的階段,完全模擬企業(yè)中的真實(shí)開發(fā)場(chǎng)景,從交互稿、設(shè)計(jì)稿、接口文檔,到項(xiàng)目打包工具,源代碼管理工具,在項(xiàng)目經(jīng)理的帶領(lǐng)下完成真實(shí)企業(yè)級(jí)項(xiàng)目的繼續(xù)開發(fā),讓學(xué)員真正體驗(yàn)并掌握從需求到開發(fā)再到上線的方方面面,無需過渡期直接適應(yīng)真正的企業(yè)開發(fā)。
1.0基礎(chǔ)0經(jīng)驗(yàn)的小白人員,想轉(zhuǎn)型到高薪編程行業(yè)或?qū)Υ诵袠I(yè)有濃厚興趣的人員;
2.在校大學(xué)生,希望充實(shí)自身技能,畢業(yè)后能順利就業(yè)并有更強(qiáng)的市場(chǎng)競(jìng)爭(zhēng)力;
3.不滿足目前工作現(xiàn)狀,想要得到更好的發(fā)展空間。
注:獲取更多免費(fèi)學(xué)習(xí)視頻+資料+筆記,請(qǐng)加QQ:2632311208。
全日制脫產(chǎn),每周5天上課(實(shí)際培訓(xùn)時(shí)間可能因法定節(jié)假日等因素發(fā)生變化)
部分校區(qū)可能會(huì)根據(jù)實(shí)際情況有所調(diào)整,詳情可詢咨詢老師 點(diǎn)擊咨詢
自帶筆記本
HTML&JS+前端基礎(chǔ)班課程大綱 | |||
所處階段 | 主講內(nèi)容 | 技術(shù)要點(diǎn) | 學(xué)習(xí)目標(biāo) |
第一階段: HTML5 + CSS3 |
HTML5 | 1、 瀏覽器與瀏覽器內(nèi)核2、語法及使用、3、 常用標(biāo)簽4. 語義化5、 表單元素6、 HTML 、7 新增標(biāo)簽 | 可掌握的核心能力: 掌握 HTML5 常用標(biāo)簽; 掌握 CSS 語法及使用技巧; 掌握CSS3新增選擇器; 掌握CSS3新增樣式屬性; 掌握 DIV+CSS 布局方式; 掌握常見網(wǎng)頁(yè)布局技巧; 掌握企業(yè)級(jí)、電商級(jí)網(wǎng)頁(yè)開發(fā)基本的流程、規(guī)范; 掌握語義化、模塊化、兼容性的PC端網(wǎng)頁(yè)開發(fā); 掌握 Photoshop 切圖以及插件切圖; 熟練使用調(diào)試工具進(jìn)行頁(yè)面調(diào)試; 掌握基本的動(dòng)畫效果。 可解決的現(xiàn)實(shí)問題: 能夠獨(dú)立把美工提供的PSD效果圖還原成PC端靜態(tài)代碼頁(yè)面。 市場(chǎng)價(jià)值: 具備PC端靜態(tài)網(wǎng)頁(yè)開發(fā)的能力,還達(dá)不到企業(yè)用人標(biāo)準(zhǔn)。為后面學(xué)習(xí)網(wǎng)頁(yè)編程階段打下堅(jiān)實(shí)基礎(chǔ)。 |
CSS3基礎(chǔ) | 1、CSS基本語法規(guī)范2、 常用的選擇器用法與技巧 3、復(fù)合選擇器使用4、 數(shù)值與單位5、文字文本樣式 6、 CSS3新增選擇器 | ||
CSS3進(jìn)階 | 1、 CSS盒子模型 2、 CSS背景技巧 3、 圓角/陰影/過渡 4、 定位和浮動(dòng) 5、 偽類和偽元素 6、chrome調(diào)試工具 7、CSS高級(jí)技巧(精靈圖、CSS三角、圖標(biāo)字體等)8、. CSS常見布局技巧大全 9、 網(wǎng)頁(yè)開發(fā)規(guī)范以及流程 10、CSS企業(yè)級(jí)網(wǎng)頁(yè)開發(fā) 11、網(wǎng)頁(yè)開發(fā)常見問題以及解決方案 12、 CSS常見兼容性問題以及解決方案 13、CSS3新增屬性 14、 Photoshop 切圖 15、cutterman插件一鍵切圖 | ||
電商項(xiàng)目 | 1、代碼組織原則 2、項(xiàng)目開發(fā)實(shí)戰(zhàn)流程 3、 電商類復(fù)雜頁(yè)面布局規(guī)范 4、CSS初始化技術(shù)選擇(Normalize.css使用)5、 CSS字體圖標(biāo)使用 6、CSS 屬性書寫順序規(guī)范7、完整的多頁(yè)面開發(fā) 8、 網(wǎng)頁(yè)語義化設(shè)計(jì) 9、 CSS頁(yè)面模塊化開發(fā) 10、favicon圖標(biāo)制作 11、復(fù)雜網(wǎng)頁(yè)結(jié)構(gòu)排版技巧 12、 常見動(dòng)畫過渡特效 13、電商類常見布局問題解決方案 14. 將電商項(xiàng)目部署到web服務(wù)器 |
本課程適合于計(jì)算機(jī)專業(yè),有一定css+div基礎(chǔ)、通過入學(xué)考核的未工作人士。
培訓(xùn)時(shí)間及周期:全日制脫產(chǎn),每周5天上課(實(shí)際培訓(xùn)時(shí)間可能因法定節(jié)假日等因素發(fā)生變化)
自帶筆記本
部分校區(qū)可能會(huì)根據(jù)實(shí)際情況有所調(diào)整,詳情可詢咨詢老師 點(diǎn)擊咨詢
HTML&JS+前端就業(yè)班課程大綱 | |||
所處階段 | 主講內(nèi)容 | 技術(shù)要點(diǎn) | 學(xué)習(xí)目標(biāo) |
第二階段: 移動(dòng)Web網(wǎng)頁(yè)開發(fā) |
CSS3動(dòng)畫 | 1、CSS3的2D和3D變換2、animation動(dòng)畫3、炫酷頁(yè)面開發(fā)(地圖大數(shù)據(jù)熱點(diǎn)圖、大風(fēng)車、旋轉(zhuǎn)木馬輪播圖等) | 學(xué)員能力體現(xiàn): 掌握CSS32D、3D變換、動(dòng)畫效果; 了解移動(dòng)端屏幕、移動(dòng)端瀏覽器、操作系統(tǒng)的不同; 掌握主流移動(dòng)端調(diào)試方法; 掌握常用移動(dòng)端適配方案(流式布局、flex布局、rem適配); 掌握主流移動(dòng)端頁(yè)面開發(fā)技術(shù)選型與解決方案; 掌握CSS預(yù)處理器less的使用; 掌握常用移動(dòng)端框架使用方法; 掌握常見移動(dòng)端頁(yè)面開發(fā)流程與規(guī)范; 掌握響應(yīng)式布局開發(fā); 掌握Bootstrap開發(fā)響應(yīng)式頁(yè)面; 掌握適配不同終端的移動(dòng)端頁(yè)面開發(fā)。 可解決的現(xiàn)實(shí)問題: 能夠獨(dú)立開發(fā)移動(dòng)端頁(yè)面,并適配不同移動(dòng)端終端。 市場(chǎng)價(jià)值: 具備移動(dòng)端頁(yè)面開發(fā),但是還不能達(dá)到企業(yè)的用人標(biāo)準(zhǔn)。為后面學(xué)習(xí)網(wǎng)頁(yè)編程階段打下堅(jiān)實(shí)基礎(chǔ)。 |
移動(dòng)端頁(yè)面開發(fā) | 1、傳統(tǒng)布局的局限性2、移動(dòng)端屏幕介紹3、移動(dòng)端瀏覽器介紹4、物理像素&物理像素比5、真機(jī)調(diào)試、6、viewport視口、7、移動(dòng)端技術(shù)選型、8、移動(dòng)端主流適配解決方案、9、移動(dòng)端特殊樣式、10、百分比布局&流失布局、11、Flex布局優(yōu)勢(shì)、12、盒子父級(jí)常見屬性設(shè)置、13、盒子子級(jí)常見屬性設(shè)置、14、攜程網(wǎng)Flex移動(dòng)端頁(yè)面開發(fā)、15、rem單位使用、16、rem適配、17、預(yù)處理器less、18、media媒體查詢、19、淘寶flexible.js移動(dòng)端適配、20、cssrem插件使用、21、cutterman二倍圖三倍圖切圖、22、移動(dòng)端頁(yè)面開發(fā)流程與規(guī)范、23、京東移動(dòng)端首頁(yè)開發(fā) | ||
Bootstrap | 1. Bootstrap框架的優(yōu)勢(shì)、2. 準(zhǔn)備工作、3. 如何引入包、4. 最常用的樣式模塊、5. 什么是柵格系統(tǒng)、6. 常見的柵格參數(shù)、7. 柵格系統(tǒng)的預(yù)定義類、8. 響應(yīng)式工具、9. 阿里百秀響應(yīng)式頁(yè)面開發(fā) | ||
第三階段: JavaScript網(wǎng)頁(yè)編程 |
JavaScript基礎(chǔ) | 1、基本輸入輸出方法2、變量3、數(shù)據(jù)類型4、類型轉(zhuǎn)換5、運(yùn)算符6、流程控制語句7、數(shù)組8、函數(shù)9、自定義對(duì)象10、內(nèi)置對(duì)象和常用方法11、網(wǎng)頁(yè)版小娜小項(xiàng)目 | 學(xué)員能力體現(xiàn): 能夠掌握J(rèn)avaScript基本語法; 掌握常見JavaScript算法; 掌握DOM的各種操作; 熟練使用面向?qū)ο笏枷脒M(jìn)行DOM編程; 掌握J(rèn)avaScript的高級(jí)語法; 熟練使用jQuery操作DOM; 熟練使用和編寫jQuery插件; 獨(dú)立完成電商網(wǎng)站的頁(yè)面搭建(包括HTML結(jié)構(gòu)、CSS樣式、JavaScript特效); 掌握應(yīng)對(duì)業(yè)務(wù)編程的能力; 掌握J(rèn)avaScript常見兼容性方案; 掌握?qǐng)F(tuán)隊(duì)合作開發(fā)流程。 可解決的現(xiàn)實(shí)問題: 能夠使用JavaScript/jQuery開發(fā)網(wǎng)頁(yè)特效/網(wǎng)頁(yè)應(yīng)用。 市場(chǎng)價(jià)值: 具備網(wǎng)頁(yè)開發(fā)的基礎(chǔ)能力(網(wǎng)頁(yè)布局和網(wǎng)頁(yè)應(yīng)用開發(fā)),但是無法和服務(wù)器交互,還達(dá)不到企業(yè)用人的標(biāo)準(zhǔn)。 |
WebAPIs編程 | 1、獲取頁(yè)面元素的常用方法2、頁(yè)面中的事件和事件機(jī)制3、操作元素的樣式和屬性4、新增元素和移除元素5、BOM操作大全 | ||
網(wǎng)頁(yè)應(yīng)用/網(wǎng)頁(yè)特效 | 1、輪播圖2、頁(yè)面放大鏡3、待辦事項(xiàng)列表4、購(gòu)物車5、tabs6、JSON7、其它常用網(wǎng)頁(yè)特效 | ||
jQuery快速開發(fā) | 1、jQuery的優(yōu)勢(shì)2、jQuery選擇器3、jQuery中的動(dòng)畫4、jQuery中的DOM操作5、鏈?zhǔn)骄幊毯碗[式迭代6、插件使用和制作7、常見網(wǎng)頁(yè)特效制作大全 | ||
面向?qū)ο缶幊?/td> | 1、面向?qū)ο笏枷搿?、創(chuàng)建對(duì)象、3、JavaScript中的對(duì)象深入理解、4、閉包原理以及使用場(chǎng)景、5、原型以及原型鏈深入剖析、6、作用域鏈深入分析、7、函數(shù)的調(diào)用方式及this指向總結(jié)、8、Class類、constructor、super | ||
第四階段: Node.js與AJAX |
AJAX編程 | 1、AJAX的作用2、原生AJAX3、同步與異步4、http協(xié)議5、AJAX的封裝6、jQuery的AJAX7、緩存問題及解決方案8、跨域請(qǐng)求及解決方案9、前端模板引擎 | 學(xué)員能力體現(xiàn): 能夠建立客戶端服務(wù)器交互模型,熟悉網(wǎng)絡(luò)通信相關(guān)概念; 能夠使用Node.js進(jìn)行Web服務(wù)端開發(fā); 能夠掌握J(rèn)avaScript異步編程模型; 能夠掌握J(rèn)avaScript模塊化編程方式; 能夠使用Node.js操作MySQL數(shù)據(jù)庫(kù); 能夠理解HTTP協(xié)議; 熟悉原生Ajax請(qǐng)求流程與細(xì)節(jié),并掌握常見跨域技巧; 能夠基于jQuery的Ajax相關(guān)API熟練開發(fā)常見的前端功能; 能夠獨(dú)立開發(fā)基于后臺(tái)接口的動(dòng)態(tài)網(wǎng)站、Ajax數(shù)據(jù)交互的項(xiàng)目; 能夠獨(dú)立完成企業(yè)網(wǎng)站從前臺(tái)到后臺(tái)的基本開發(fā)工作。 可解決的現(xiàn)實(shí)問題: 能夠具備開發(fā)具有簡(jiǎn)單交互能力的網(wǎng)站,能夠使用源代碼管理工具。 市場(chǎng)價(jià)值: 具備基本的網(wǎng)站開發(fā)能力,滿足企業(yè)對(duì)初級(jí)前端開發(fā)的要求。 |
git | 1、git歷史2、git與svn3、git基本使用4、git分支5、git遠(yuǎn)程倉(cāng)庫(kù)6、git沖突及解決方案 | ||
綜合項(xiàng)目: 阿里百秀 |
1、項(xiàng)目初始化2、前后端分離開發(fā)3、Postman工具使用4、用戶注冊(cè)/登錄/退出5、文章管理模塊6、評(píng)論管理模塊7、用戶中心模塊8、項(xiàng)目部署與發(fā)布 | ||
ES6 | 1、es6簡(jiǎn)介2、新增語法3、內(nèi)置對(duì)象擴(kuò)展4、Promise5、Async函數(shù)6、解構(gòu)7.展開運(yùn)算 | ||
Node.js基礎(chǔ) | 1、node.js環(huán)境安裝2、如何用node.js運(yùn)行代碼3、Commonjs4、模塊化5、模塊與包6、NPM7、CNPM和Yarn8、核心模塊使用9、第三方模塊使用10、RESTFulAPI | ||
服務(wù)端開發(fā)(Node.js) | 1、靜態(tài)和動(dòng)態(tài)網(wǎng)站2、http模塊使用3、請(qǐng)求響應(yīng)原理4、HTTP協(xié)議5、處理頁(yè)面請(qǐng)求6、處理表單7、會(huì)話技術(shù)(Cookie、Session) | ||
MySQL | 1、MySQL的概念2、MySQL安裝3、建庫(kù)和建表4、增刪改查語句5、Node.js操縱MySQL | ||
Express | 1、express的概念2、express的安裝3、后端路由4、靜態(tài)資源托管5、中間件的原理6、常用中間件7、模板引擎8、異常處理9、Express常用API10、RESTFulAPI | ||
第五階段: Vue.js項(xiàng)目實(shí)戰(zhàn) |
Vue.js基礎(chǔ) | 1、Vue實(shí)例2、文本與屬性綁定3、計(jì)算屬性computed4、偵聽器watch5、Class與Style綁定6、條件渲染7、列表渲染8、事件處理9、表單輸入綁定10、Vue實(shí)例生命周期11、開發(fā)Vue插件和模板過濾器12、自定義指令13、Vue組件系統(tǒng)14、Vue過渡和動(dòng)畫15、VueRouter路由系統(tǒng)16、組件通信17、axios請(qǐng)求庫(kù)18、VueCLI腳手架工具19、VueDevTools調(diào)試工具20、在Vue中操作DOM | 可掌握的核心能力: 能夠掌握使用Vue技術(shù)棧進(jìn)行項(xiàng)目開發(fā); 能夠掌握源代碼管理工具的使用; 能夠熟練掌握前后端分離開發(fā)模式; 能夠掌握使用主流框架開發(fā)門戶網(wǎng)站、管理系統(tǒng)、移動(dòng)Web等客戶端; 能夠掌握Webpack項(xiàng)目構(gòu)建配置流程; 能夠掌握Web項(xiàng)目的部署與發(fā)布模式; 能夠掌握常見網(wǎng)站業(yè)務(wù)模塊開發(fā)。 掌握使用echarts/d3.js進(jìn)行大數(shù)據(jù)可視化交互開發(fā); 可解決的現(xiàn)實(shí)問題: 使用Vue技術(shù)棧開發(fā)企業(yè)級(jí)項(xiàng)目 掌握前后端分離的開發(fā)方式 掌握項(xiàng)目的打包和發(fā)布 市場(chǎng)價(jià)值: 理解Vue的開發(fā)理念、內(nèi)部運(yùn)行原理,梳理使用Vue組件開發(fā)常見功能。滿足前端開發(fā)行業(yè)中的常見需求。 |
社交媒體- 黑馬頭條自媒體管理系統(tǒng) |
1、使用VueCLI初始化項(xiàng)目2、使用Git+Github管理項(xiàng)目源代碼3、使用echarts開發(fā)數(shù)據(jù)可視化4、使用axios與服務(wù)端交互5、使用VueRouter管理項(xiàng)目中的路由6、使用ElementUI框架7、使用Sass預(yù)處理器8、基于JWT的前后端token鑒權(quán)9、富文本編輯器解決方案10、項(xiàng)目打包發(fā)布上線 | ||
webpack | 1、安裝與基本配置2、打包JavaScript模塊3、打包CSS模塊4、打包圖片和字體文件模塊5、打包less/sass資源模塊6、ES6轉(zhuǎn)ES57、打包.vue資源模塊8、配置ESLint代碼校驗(yàn)工具9、使用clean-webpack-plugin插件清除打包結(jié)果目錄10、使用HtmlWebpackPlugin打包HTML資源11、處理打包結(jié)果的Sourcemaps12、監(jiān)視打包模式13、使用webpack-dev-server14、模塊打包熱更新15、treeshaking打包優(yōu)化16、生產(chǎn)環(huán)境和開發(fā)環(huán)境分離打包17、打包優(yōu)化之CodeSplitting代碼分割18、打包優(yōu)化之模塊懶加載19、打包優(yōu)化之緩存 | ||
社交媒體- 黑馬頭條 |
1、使用VueCLI初始化項(xiàng)目2、使用Git+Github管理項(xiàng)目源代碼3、使用axios與服務(wù)端交互4、使用VueRouter管理項(xiàng)目中的路由5、使用VantUI框架6、使用Vuex管理組件狀態(tài)7、使用Sass預(yù)處理器8、基于JWT的前后端token鑒權(quán)9、使用Socket.io進(jìn)行實(shí)時(shí)通信10、移動(dòng)端富文本編輯器解決方案11、使用Cordova打包移動(dòng)App12、項(xiàng)目打包發(fā)布上線 | ||
Vue進(jìn)階 | 1、組件封裝進(jìn)階2、MVVM數(shù)據(jù)綁定原理3、Render方法原理4、$nextTick方法的使用5、發(fā)布訂閱模式 | ||
服務(wù)端渲染 | 1、SSR核心概念2、SSR基本用法3、編寫通用代碼4、路由和代碼分割5、構(gòu)建配置6、Nuxt.js | ||
大數(shù)據(jù)可視化 | 1、數(shù)據(jù)庫(kù)可視化基礎(chǔ)2、echarts/d3.js入門3、其它可視化庫(kù)4、大數(shù)據(jù)可視化實(shí)戰(zhàn)項(xiàng)目:組件開發(fā) | ||
第六階段: 微信小程序 |
小程序基礎(chǔ) | 1、小程序注冊(cè)2、小程序開發(fā)者工具使用教程3、小程序配置文件4、小程序常用組件5、小程序的模板語法6、小程序中的樣式編寫7、小程序中的JavaScript8、小程序應(yīng)用及頁(yè)的生命周期9、小程序常用API10、小程序中的自定組件11、小程序插件開發(fā)12、小程序分包加載13、小程序基礎(chǔ)庫(kù)版及兼容處理14、小程序運(yùn)行機(jī)制15、小程序性能分析及優(yōu)化16、小程序云開發(fā)、云函數(shù)、云數(shù)據(jù)庫(kù)17、小程序上線和發(fā)布 | 可掌握的核心能力: 能夠掌握小程序的開發(fā)基礎(chǔ); 能夠獨(dú)立開發(fā)小程序項(xiàng)目; 能夠掌握小程序的部署與發(fā)布; 能夠掌握微信支付的使用; 能夠掌握小程序開發(fā)框架的使用; 掌握第三方AI平臺(tái)的使用。 可解決的現(xiàn)實(shí)問題: 掌握整個(gè)小程序開發(fā)和傳統(tǒng)web開發(fā)的區(qū)別; 掌握企業(yè)小程序開發(fā)、發(fā)布和上線的整體流程; 擁有解決和實(shí)現(xiàn)市場(chǎng)上主流小程序的功能需求。 市場(chǎng)價(jià)值: 掌握前端行業(yè)的小程序發(fā)展趨勢(shì),熟悉小程序項(xiàng)目的整體運(yùn)作流程,并且具備獨(dú)立開發(fā)企業(yè)級(jí)小程序的能力,既可以使用原生小程序也可以使用小程序框架來完成項(xiàng)目。 |
小程序項(xiàng)目: 黑馬優(yōu)購(gòu)商城 |
1、原生框架的搭建2、商品首頁(yè)模塊3、分類商品模塊4、商品列表模塊5、商品詳情模塊6、支付和登錄模塊7、收藏模塊8、購(gòu)物車模塊9、訂單模塊10、搜索頁(yè)面模塊11、個(gè)人中心模塊12、意見反饋模塊13、項(xiàng)目的優(yōu)化和發(fā)布上線 | ||
第七階段: React.js項(xiàng)目實(shí)戰(zhàn) |
React.js基礎(chǔ) | 1、create-react-app腳手架工具2、JSX語法3、條件渲染4、列表渲染和key5、React組件系統(tǒng)6、PureComponent7、setState()8、事件處理9、表單處理10、組件通訊11、render-props12、高階組件13、虛擬DOM和Diff算法14、ReactRouter路由系統(tǒng)15、Redux狀態(tài)管理架構(gòu)16、axios請(qǐng)求庫(kù)17、AntDesign組件框架、18、CSSModules | 可掌握的核心能力: 能夠理解React的開發(fā)理念; 能夠掌握React的基本使用; 能夠理解React的內(nèi)部原理; 能夠使用React及其常用組件庫(kù)進(jìn)行項(xiàng)目開發(fā); 能夠使用React封裝項(xiàng)目中用到組件實(shí)現(xiàn)復(fù)用; 能夠掌握React項(xiàng)目中常見問題的解決方案; 能夠掌握React-Redux進(jìn)行狀態(tài)管理; 能夠掌握聲明式編程的思想; 能夠掌握組件化開發(fā)的思想; 能夠掌握React項(xiàng)目?jī)?yōu)化、部署。 可解決的現(xiàn)實(shí)問題: 具備使用React開發(fā)能力,配合React內(nèi)部原理,增強(qiáng)解決項(xiàng)目中復(fù)雜業(yè)務(wù)問題的能力,從項(xiàng)目搭建到項(xiàng)目開發(fā)再到項(xiàng)目部署上線,讓學(xué)員可以完成常見企業(yè)級(jí)項(xiàng)目的開發(fā)。 市場(chǎng)價(jià)值: 理解React的開發(fā)理念、內(nèi)部運(yùn)行原理,熟練運(yùn)用React組件完成項(xiàng)目常見功能開發(fā),配合常用組件庫(kù)解決項(xiàng)目中的一些共性問題,滿足前端開發(fā)行業(yè)中的常見需求。 |
好客租房 PC端項(xiàng)目 |
1、項(xiàng)目初始化2、管理員登錄退出3、用戶管理4、用戶已發(fā)布房源查看5、房源列表6、房源列表檢索等功能7、使用redux進(jìn)行狀態(tài)管理 | ||
好客租房 移動(dòng)Web項(xiàng)目 |
1、項(xiàng)目初始化2、首頁(yè)搭建3、地理定位4、城市選擇5、地圖找房6、房源搜索7、關(guān)鍵詞搜索8、房源詳情9、個(gè)人中心10、用戶登錄/注冊(cè)/退出11、房源收藏12、查看用戶收藏房源列表13、房源發(fā)布14、已發(fā)布房源列表查看15、權(quán)限路由組件封裝16、移動(dòng)端長(zhǎng)列表性能優(yōu)化17、React復(fù)雜表單處理18、React動(dòng)畫等常見解決方案 |
初入前端開發(fā)行業(yè)的初級(jí)、中級(jí)前端開發(fā)者。
注:獲取更多免費(fèi)學(xué)習(xí)視頻+資料+筆記,請(qǐng)加QQ:2632311208。
在線學(xué)習(xí)
隨到隨學(xué),詳情可詢咨詢老師 點(diǎn)擊咨詢
HTML&JS+前端中級(jí)進(jìn)修課課程大綱 | |||
所處階段 | 主講內(nèi)容 | 技術(shù)要點(diǎn) | 學(xué)習(xí)目標(biāo) |
第八階段: 框架原理與進(jìn)階 |
前端工程化 | 工程化概念、模塊化開發(fā)及常用工具(Webpack4、Parcel、Rollup)、項(xiàng)目規(guī)范化及常用工具(ESLint、StyleLint)、前端自動(dòng)化及常用工具、自動(dòng)化測(cè)試及常用工具(istanbul、jest、benchmark) | 學(xué)員能力體現(xiàn): - 能夠輕松運(yùn)用目前市場(chǎng)主流工具應(yīng)對(duì)工程化項(xiàng)目需求; - 能夠基于無服務(wù)端平臺(tái)快速開發(fā)應(yīng)用并了解國(guó)內(nèi)主流的平臺(tái)服務(wù); - 能夠使用靜態(tài)站點(diǎn)構(gòu)建方案快速開發(fā)企業(yè)站; - 能夠使用 Flow、TypeScript 完成復(fù)雜應(yīng)用業(yè)務(wù)代碼的編寫; - 能夠掌握使用 Angular 技術(shù)棧進(jìn)行項(xiàng)目開發(fā); - 能夠理解 React.js / Vue.js 一類的 MVVM 框架的實(shí)現(xiàn)原理; - 能夠使用不同的數(shù)據(jù)流框架應(yīng)對(duì)不同技術(shù)棧在大型項(xiàng)目中的數(shù)據(jù)狀態(tài)管理; - 能夠使用服務(wù)端渲染解決方案解決 React.js / Vue.js / Angular 框架在 SEO 方面的問題; - 能夠掌握不同框架的服務(wù)端渲染的實(shí)現(xiàn)及運(yùn)用; - 能夠使用 React16 + Redux4 + ReactRouter4 + Next.js 完成社交類項(xiàng)目的開發(fā)。 關(guān)鍵詞: 工程化、自動(dòng)化、無服務(wù)端、Gatsby、TypeScript、Flow、Angular、MVVM 框架原理、Mobx、RxJS、SSR、Next.js、Nuxt.js、Universal |
閑云旅游項(xiàng)目 | 無服務(wù)端方案(LeanCloud)、靜態(tài)站點(diǎn)生成工具(Gatsby、React Static、VuePress)、旅游類項(xiàng)目業(yè)務(wù) | ||
JavaScript 進(jìn)階 | Flow 類型檢查、TypeScript 適應(yīng)超大型的應(yīng)用編碼 | ||
Angular 實(shí)戰(zhàn)開發(fā) | Angular 組件的定義及使用、Angular 服務(wù)、Angular 路由、表單、依賴注入 | ||
MVVM 框架進(jìn)階與實(shí)現(xiàn) | Vue.js 原理、Vue.js 使用進(jìn)階、模擬實(shí)現(xiàn) Vue.js 框架 | ||
數(shù)據(jù)流框架的應(yīng)用 | Redux、Mobx、Vuex、RxJS、ngrx | ||
服務(wù)端渲染 SSR 專題 | React.js 服務(wù)端渲染方案及 Next.js 框架、Vue.js 服務(wù)端渲染方案及 Nuxt.js、Angular 服務(wù)端渲染方案及 Universal Angular | ||
學(xué)成在線項(xiàng)目 | React16、Redux4、ReactRouter4、Next.js | ||
跨平臺(tái)桌面應(yīng)用開發(fā) | Electron、Vue.js / React.js 在 Electron 中的使用 | ||
第九階段: 移動(dòng) App 開發(fā) |
混合式 App 開發(fā)框架 | Cordova、Phonegap、Ionic | 學(xué)員能力體現(xiàn): - 能夠使用混合式 App 開發(fā)框架快速開發(fā)移動(dòng) App; - 能夠配合原生應(yīng)用開發(fā) App 內(nèi)嵌 H5 頁(yè)面并可以通過 JSBridge 調(diào)用原生接口; - 能夠使用 wepy / mpvue 框架開發(fā)小程序或快應(yīng)用項(xiàng)目; - 能夠使用 taro 多端統(tǒng)一解決方案同時(shí)完成移動(dòng) App、移動(dòng) Web、小程序的開發(fā); - 能夠獨(dú)立使用 React Native 開發(fā)原生 App; - 了解 Weex / Flutter 等其他原生應(yīng)用的前端技術(shù)開發(fā)方式。 關(guān)鍵詞: Cordova、Ionic、Webview + H5、JSBridge、mpvue、taro、Weex、Flutter |
H5 配合原生開發(fā) App | Webview + H5、JSbridge、NativeScript | ||
黑馬證券 App 項(xiàng)目 | Vue.js 開發(fā)移動(dòng)H5、配合原生 Webview 構(gòu)建 App、金融業(yè)務(wù)項(xiàng)目 | ||
小程序/快應(yīng)用開發(fā)框架 | WEPY、MPVUE、Taro 統(tǒng)一開發(fā)解決方案 | ||
原生應(yīng)用開發(fā)框架 | Flutter、React Native、Weex | ||
好客租房 App 項(xiàng)目 | React Native 構(gòu)建租房類 App 項(xiàng)目 | ||
第十階段: Node.js 進(jìn)階 |
Node.js 網(wǎng)絡(luò)通信 | TCP 協(xié)議、net 模塊、Socket | 學(xué)員能力體現(xiàn): - 能夠基于 net 模塊開發(fā) Socket 應(yīng)用并深度理解 HTTP 協(xié)議; - 徹底理解 Node.js 中的事件循環(huán)特性; - 能夠使用 Cluster 開發(fā)多進(jìn)程應(yīng)用充分發(fā)揮多核 CPU; - 能夠操作常見的 NoSQL 數(shù)據(jù)庫(kù)并能夠通過 Node.js 操作; - 能夠掌握主流的 MVC Web 應(yīng)用開發(fā)框架 Adonis、Egg; - 能夠升入理解基于 GraphQL 標(biāo)準(zhǔn)開發(fā)現(xiàn)代化的應(yīng)用層接口; - 能夠掌握 Node.js 中途島在企業(yè)級(jí)項(xiàng)目中的應(yīng)用; - 能夠使用 Node.js 開發(fā)基本的網(wǎng)絡(luò)爬蟲應(yīng)用。 關(guān)鍵詞: Socket、EventLoop、Cluster、Redis、MongoDB、Memcached、Adonis.js、Egg.js、GraphQL、微服務(wù)、Nightmare、Puppeteer |
Node.js 事件循環(huán)與多進(jìn)程 | EventLoop、Cluster | ||
NoSQL 數(shù)據(jù)庫(kù) | Redis / MongoDB / Memcached 基本使用及如何通過 Node.js 操作 | ||
Web 應(yīng)用開發(fā)框架 | Adonis.js、Egg.js、Koa | ||
BaaS 接口標(biāo)準(zhǔn) | GraphQL | ||
十次方項(xiàng)目 | Node.js 中間層、社交類業(yè)務(wù)項(xiàng)目 | ||
網(wǎng)絡(luò)爬蟲開發(fā) | Cheerio、Nightmare、Puppeteer | ||
第十一階段: 可視化與游戲 |
網(wǎng)頁(yè)游戲開發(fā)基礎(chǔ) | Canvas | 學(xué)員能力體現(xiàn): - 能夠使用 HTML5 技術(shù)開發(fā)網(wǎng)頁(yè)游戲; - 能夠使用 WebGL 技術(shù)完成炫酷 3D 類圖形效果; - 能夠掌握常用的可視化庫(kù)的應(yīng)用; - 能夠使用 Three.js 開發(fā)簡(jiǎn)單的 3D 網(wǎng)頁(yè)游戲; - 能夠使用 HTML5 游戲引擎開發(fā)網(wǎng)頁(yè)游戲。 關(guān)鍵詞: WebGL、Three.js、H5 游戲、游戲引擎、Cocos2d-x、Egret |
網(wǎng)頁(yè)高性能圖形編程 | WebGL | ||
圖形化開發(fā)庫(kù) | Three.js、D3.js | ||
HTML5 游戲引擎 | Cocos2d-x、Egret | ||
第十二階段: 架構(gòu)與運(yùn)維 |
前端性能優(yōu)化 | JSPerf、YSlow、PageSpeed | 學(xué)員能力體現(xiàn): - 能夠通過不同的工具發(fā)現(xiàn) Web 項(xiàng)目的性能瓶頸并加以解決; - 能夠掌握使用不同的工具和平臺(tái)對(duì)項(xiàng)目及代碼進(jìn)行質(zhì)量監(jiān)測(cè); - 能夠使用不同的自動(dòng)化測(cè)試框架完成項(xiàng)目的單元測(cè)試和集成測(cè)試; - 能夠使用 Jenkins、TravisCI 等工具對(duì)項(xiàng)目進(jìn)行持續(xù)集成和持續(xù)部署; - 能夠掌握基本的 Linux 服務(wù)器操作與維護(hù); - 能夠掌握 Nginx Web 服務(wù)器的搭建與配置; - 了解 Docker 容器化平臺(tái)的基本操作。 關(guān)鍵詞: JSPerf、YSlow、PageSpeed、E2E、QA、Jest、AVA、Nightmare、持續(xù)集成、持續(xù)部署、Jenkins、Nginx、Docker |
項(xiàng)目質(zhì)量監(jiān)測(cè) | Lint、e2e test、codecov、Benchmark | ||
自動(dòng)化測(cè)試 | Mocha、Jest、AVA、Karma、Nightmare | ||
持續(xù)集成與持續(xù)部署 | Jenkins、TravisCI、CircleCI | ||
Linux 服務(wù)器 | Nginx、HTTP(s)、ECS、RDS、SLB 云服務(wù) | ||
容器化運(yùn)維操作 | Docker 操作、部署、運(yùn)維 |
備注:該課程大綱僅供參考,實(shí)際課程內(nèi)容可能在授課過程中發(fā)生更新或變化,具體授課內(nèi)容最終以各班級(jí)課表為準(zhǔn)。
每晚對(duì)學(xué)員當(dāng)天知識(shí)的吸收程度、老師授課內(nèi)容難易程度進(jìn)行評(píng)分,老師會(huì)根據(jù)學(xué)員反饋進(jìn)行分析,對(duì)學(xué)員吸收情況調(diào)整授課內(nèi)容、課程節(jié)奏,最終讓每位學(xué)員都可以跟上班級(jí)學(xué)習(xí)的整體節(jié)奏。
為每個(gè)就業(yè)班都安排了一名優(yōu)秀的技術(shù)指導(dǎo)老師,不管是白天還是晚自習(xí)時(shí)間,隨時(shí)解答學(xué)員問題,進(jìn)一步鞏固和加強(qiáng)課上知識(shí)。
為了能輔助學(xué)員掌握所學(xué)知識(shí),黑馬程序員自主研發(fā)了6大學(xué)習(xí)系統(tǒng),包括教學(xué)反饋系統(tǒng)、學(xué)習(xí)難易和吸收分析系統(tǒng)、學(xué)習(xí)測(cè)試系統(tǒng)、在線作業(yè)系統(tǒng)、學(xué)習(xí)任務(wù)手冊(cè)、學(xué)員綜合能力評(píng)定分析等。
末位輔導(dǎo)隊(duì)列的學(xué)員,將會(huì)得到重點(diǎn)關(guān)心。技術(shù)輔導(dǎo)老師會(huì)在學(xué)員休息時(shí)間,針對(duì)學(xué)員的疑惑進(jìn)行知識(shí)點(diǎn)梳理、答疑、輔導(dǎo)。以確保知識(shí)點(diǎn)掌握上沒有一個(gè)學(xué)員掉隊(duì),真正落實(shí)不拋棄,不放棄任何一個(gè)學(xué)員。
從學(xué)員學(xué)習(xí)中的心態(tài)調(diào)整,到生活中的困難協(xié)助,從課上班級(jí)氛圍塑造到課下多彩的班級(jí)活動(dòng),班主任360度暖心鼓勵(lì)相伴。
小到五險(xiǎn)一金的解釋、面試禮儀的培訓(xùn);大到500強(qiáng)企業(yè)面試實(shí)訓(xùn)及如何針對(duì)性地制定復(fù)習(xí)計(jì)劃,幫助學(xué)員拿到高薪Offer。