大連WEB前端工程師課程

Web前端培訓(xùn)課程

階段一：前端基礎(chǔ)入門

1、HTML5基礎(chǔ)語(yǔ)法與標(biāo)簽

這是入門前端的，學(xué)會(huì)IDE插件安裝和使用，掌握H5語(yǔ)法和基礎(chǔ)標(biāo)簽的應(yīng)用，學(xué)完這些內(nèi)容可以進(jìn)行簡(jiǎn)單的頁(yè)面結(jié)構(gòu)搭建。

課程安排：

1、了解前端行業(yè)發(fā)展

2、了解HTML5對(duì)于網(wǎng)頁(yè)的意義

3、學(xué)習(xí)常用標(biāo)簽/屬性，進(jìn)行結(jié)構(gòu)搭建

4、掌握無(wú)序列表/有序列表/自定義列表

5、學(xué)習(xí)表單標(biāo)簽/屬性，能創(chuàng)建常見(jiàn)表單結(jié)構(gòu)

6、掌握標(biāo)簽嵌套規(guī)則/行內(nèi)元素/塊元素的使用

7、學(xué)習(xí)VSCode開(kāi)發(fā)工具使用，能創(chuàng)建簡(jiǎn)單網(wǎng)頁(yè)

2、CSS3基礎(chǔ)語(yǔ)法與盒模型

CSS3是網(wǎng)頁(yè)的"美容師"，開(kāi)始學(xué)習(xí)CSS3樣式，掌握語(yǔ)法結(jié)構(gòu)、選擇器、盒子模型、文本和字體樣式設(shè)置，能夠?qū)W(wǎng)頁(yè)進(jìn)行簡(jiǎn)單的樣式開(kāi)發(fā)。

課程安排：

1、掌握CSS3基本語(yǔ)法和使用

2、掌握CSS3各類選擇器/樣式屬性，快速進(jìn)行樣式設(shè)置

3、學(xué)習(xí)文本、字體等常見(jiàn)屬性

4、盒子模型核心知識(shí)講解，深入理解原理

5、掌握行內(nèi)元素和塊級(jí)元素設(shè)置與轉(zhuǎn)換

3、CSS3浮動(dòng)定位與背景樣式

簡(jiǎn)單的樣式開(kāi)發(fā)還不夠，通過(guò)掌握浮動(dòng)、定位、邊框、背景樣式以及2D&3D轉(zhuǎn)換，以及布局技巧。能夠進(jìn)行特殊圖形繪制，開(kāi)發(fā)更美觀的網(wǎng)頁(yè)效果。

課程安排：

1、浮動(dòng)與定位核心知識(shí)，靈活運(yùn)用實(shí)現(xiàn)網(wǎng)頁(yè)布局

2、常見(jiàn)布局方法，解決布局常見(jiàn)問(wèn)題

3、如何繪制圓角邊框/陰影框/圖片邊框等特殊圖形

4、掌握元素扭曲/移位/旋轉(zhuǎn)，更自由的裝飾HTML

5、BFC規(guī)范和瀏覽器差異

4、CSS3動(dòng)畫與窮游首頁(yè)開(kāi)發(fā)實(shí)戰(zhàn)

CSS3也能實(shí)現(xiàn)炫酷的網(wǎng)頁(yè)動(dòng)態(tài)效果，結(jié)合企業(yè)級(jí)上線“旅游網(wǎng)”項(xiàng)目，綜合運(yùn)用前面所學(xué)的知識(shí)，完成窮游首頁(yè)排版布局和CSS3動(dòng)畫特效開(kāi)發(fā)。

課程安排：

1、大項(xiàng)目：結(jié)合H5/CSS3，完成PC端仿窮游首頁(yè)布局開(kāi)發(fā)

2、掌握不同布局結(jié)構(gòu)與技巧

3、掌握過(guò)渡的使用與緩動(dòng)效果，實(shí)現(xiàn)常見(jiàn)小案例

4、運(yùn)用動(dòng)畫效果，實(shí)現(xiàn)炫酷動(dòng)畫效果

5、大作業(yè)：棧家居網(wǎng)頁(yè)布局開(kāi)發(fā)

5、JS基礎(chǔ)語(yǔ)法與表達(dá)式

JS是網(wǎng)頁(yè)編程，開(kāi)始學(xué)習(xí)JS編程語(yǔ)言，掌握基礎(chǔ)語(yǔ)法結(jié)構(gòu)、變量聲明和命名規(guī)則、數(shù)據(jù)類型、表達(dá)式和操作符，學(xué)完這些內(nèi)容可以進(jìn)行簡(jiǎn)單的JS代碼編寫。

課程安排：

1、掌握J(rèn)S基本語(yǔ)法使用

2、掌握J(rèn)S變量聲明與提升的機(jī)理

3、掌握J(rèn)S運(yùn)算符操作與表達(dá)式

4、學(xué)習(xí)基本數(shù)據(jù)類型和復(fù)雜數(shù)據(jù)類型使用

5、深入理解數(shù)據(jù)類型轉(zhuǎn)換與檢測(cè)

6、小案例：計(jì)算器和表達(dá)式綜合運(yùn)用

6、JS流程控制語(yǔ)句與數(shù)組

繼續(xù)深入學(xué)習(xí)JS編程語(yǔ)言，掌握條件分支語(yǔ)句、循環(huán)語(yǔ)句和數(shù)組，學(xué)完這些內(nèi)容可以用簡(jiǎn)潔的代碼實(shí)現(xiàn)強(qiáng)大功能。

課程安排：

1、掌握if，if elseif，switch等條件分支語(yǔ)句使用

2、掌握f(shuō)or、while、do while循環(huán)語(yǔ)句使用

3、掌握數(shù)組基本使用和常用方法

4、break和continue語(yǔ)句的特點(diǎn)及應(yīng)用

5、運(yùn)用數(shù)組知識(shí)，學(xué)習(xí)基本算法

6、使用簡(jiǎn)單的邏輯實(shí)現(xiàn)復(fù)雜業(yè)務(wù)邏輯

7、小案例：常見(jiàn)算法綜合運(yùn)用

7、JS函數(shù)與DOM

如想實(shí)現(xiàn)更炫的動(dòng)態(tài)效果，那么操控網(wǎng)頁(yè)元素很重要，通過(guò)掌握函數(shù)編程、DOM操作、事件以及BOM對(duì)象，讓你能實(shí)現(xiàn)典型的觸發(fā)和動(dòng)態(tài)交互效果。

課程安排：

1、掌握DOM操作和DOM事件

2、掌握函數(shù)基礎(chǔ)與函數(shù)高級(jí)應(yīng)用

3、掌握BOM瀏覽器對(duì)象模型，與瀏覽器“對(duì)話”

4、掌握函數(shù)封裝，提升編碼質(zhì)量

5、小案例：有趣的動(dòng)畫效果開(kāi)發(fā)

8、面向?qū)ο?/h3>

面向?qū)ο笫情_(kāi)發(fā)中非常重要的思想，我們將開(kāi)始運(yùn)用面向?qū)ο笏枷脒M(jìn)行程序開(kāi)發(fā)，編寫高質(zhì)量代碼，解決企業(yè)級(jí)編程協(xié)同問(wèn)題。

課程安排：

1、學(xué)習(xí)this規(guī)則與使用

2、掌握構(gòu)造函數(shù)概念以及創(chuàng)建、調(diào)用與使用

3、理解原型和原型鏈的關(guān)系與運(yùn)用

4、閉包和作用域應(yīng)用

5、熟練使用面向?qū)ο笏枷脒M(jìn)行DOM編程

6、掌握J(rèn)S模塊化編程方式，編寫高質(zhì)量代碼

7、掌握模塊化開(kāi)發(fā)技巧，解決企業(yè)級(jí)編程協(xié)同問(wèn)題

8、小案例：俄羅斯方塊游戲開(kāi)發(fā)

9、項(xiàng)目實(shí)戰(zhàn)：仿窮游JS特效開(kāi)發(fā)

實(shí)戰(zhàn)出真知，綜合運(yùn)用H5、CSS3和JS所學(xué)知識(shí)，從0到1完成一個(gè)具備CSS3動(dòng)畫和JS特效的多特效旅游網(wǎng)頁(yè)。掌握企業(yè)常見(jiàn)的網(wǎng)頁(yè)開(kāi)發(fā)方式和各類特效實(shí)現(xiàn)方案。

課程安排：

1、結(jié)合H5/CSS3/JS，完成PC端仿窮游首頁(yè)特效開(kāi)發(fā)

2、項(xiàng)目動(dòng)畫效果分析，幫助更快梳理思路

3、實(shí)現(xiàn)典型JS特效效果：Banner圖、返回頂部動(dòng)畫、垂直菜單

4、學(xué)習(xí)正則表達(dá)式，完成常見(jiàn)手機(jī)號(hào)、郵箱、姓名等功能驗(yàn)證

3、大作業(yè)：棧家居網(wǎng)頁(yè)JS特效開(kāi)發(fā)

階段二：組件化與移動(dòng)WebApp開(kāi)發(fā)

1、ES6基礎(chǔ)入門

ES6是JavaScript新的語(yǔ)法規(guī)范，讓代碼更規(guī)范、可讀性高、方便操作。將開(kāi)啟ES6的學(xué)習(xí)，這是學(xué)習(xí)前端必備的一步。掌握ES6相關(guān)知識(shí)后，能夠更便捷的編寫代碼，提高開(kāi)發(fā)效率。

課程安排：

1、ES6基本語(yǔ)法與使用

2、掌握ES6中變量和常量的使用與區(qū)別

3、學(xué)習(xí)可以嵌入表達(dá)式的字符串字面量--模板字符串

4、掌握箭頭函數(shù)的特點(diǎn)與應(yīng)用

5、掌握如何自動(dòng)解析數(shù)組或?qū)ο笾械闹?/p>

6、了解對(duì)象字面量更加簡(jiǎn)潔與靈活的表達(dá)方式

7、掌握參數(shù)默認(rèn)值的使用

2、ES6語(yǔ)法擴(kuò)展

繼續(xù)學(xué)習(xí)ES6的基礎(chǔ)，通過(guò)進(jìn)一步學(xué)習(xí)ES6引入的新特性，了解ES6的新方法，掌握新的集合類型，更深入的了解數(shù)據(jù)的遍歷。

課程安排：

1、剩余參數(shù)與展開(kāi)運(yùn)算符的對(duì)比進(jìn)行學(xué)習(xí)

2、了解如何實(shí)現(xiàn)減少邏輯或操作符的使用

3、認(rèn)識(shí)ES6中新增的數(shù)據(jù)結(jié)構(gòu)

4、了解ES6中新增的方法

5、了解遍歷原理，以及學(xué)習(xí)新的循環(huán)方式

3、ES6之Promise與Class類

Promise 和 Class（類）是ES6中非常重要的知識(shí)點(diǎn)。Promise 是異步編程的一種解決方案，比傳統(tǒng)的回調(diào)函數(shù)更合理和更強(qiáng)大。Class（類）來(lái)作為對(duì)象的模板使用，強(qiáng)化面向?qū)ο蟮氖褂谩?/p>

課程安排：

1、學(xué)習(xí)如何高效解決回調(diào)地域問(wèn)題

2、了解如何運(yùn)用ES6 Promise進(jìn)行異步編程

3、掌握Class基本語(yǔ)法的使用

4、掌握更加清晰與便捷的對(duì)象繼承方式

5、掌握更高級(jí)的面向?qū)ο缶幊趟枷?/p>

4、ES6之Module模塊與Babel編譯

ES6 在語(yǔ)言標(biāo)準(zhǔn)的層面上，實(shí)現(xiàn)了模塊功能?？梢詫?shí)現(xiàn)將一個(gè)大程序拆分成互相依賴的小文件。而babel的使用，完美的解決了ES6的兼容性問(wèn)題，讓ES6有更多可能性，使前后端差異越來(lái)越小。

課程安排：

1、了解企業(yè)級(jí)的開(kāi)發(fā)形式——模塊化的使用

2、學(xué)習(xí)將一個(gè)復(fù)雜的功能拆分，從而提高復(fù)用率

3、了解如何更好的維護(hù)代碼

4、掌握babel轉(zhuǎn)換器的使用，解決ES6的兼容問(wèn)題

5、學(xué)習(xí)如何將Webpack與配合Babel使用，完成更高效的開(kāi)發(fā)

6、掌握Webpack項(xiàng)目構(gòu)建配置

5、HTTP 協(xié)議、存儲(chǔ)、Ajax

開(kāi)啟前后端數(shù)據(jù)交互的學(xué)習(xí)，來(lái)理解前后端開(kāi)發(fā)的區(qū)別，了解網(wǎng)絡(luò)通信的相關(guān)概念，并對(duì)與后臺(tái)通信、獲取數(shù)據(jù)有一個(gè)初體驗(yàn)。概念比較抽象，先作為了解。在后面項(xiàng)目開(kāi)發(fā)環(huán)節(jié)，隨著對(duì)知識(shí)的運(yùn)用，對(duì)概念會(huì)有更深一步的理解。

課程安排：

1、了解如何區(qū)分前后端

2、理解HTTP協(xié)議，熟悉網(wǎng)絡(luò)通信相關(guān)概念

3、學(xué)習(xí)本地存儲(chǔ)的多種方式，了解數(shù)據(jù)緩存機(jī)制

4、了解JOSN數(shù)據(jù)的幾種書寫格式

5、熟悉原生Ajax請(qǐng)求流程與細(xì)節(jié)

6、掌握常見(jiàn)的跨域技巧

7、學(xué)習(xí)如何自己封裝Ajax

8、了解基于promise的Ajax插件——Axios

6、項(xiàng)目實(shí)戰(zhàn)：仿窮游組件化開(kāi)發(fā)

組件化開(kāi)發(fā)是一種高級(jí)編程思想，適用于團(tuán)隊(duì)協(xié)作開(kāi)發(fā)，是企業(yè)中常見(jiàn)的一種開(kāi)發(fā)模式。會(huì)使用組件化方式來(lái)完成“仿窮游商城首頁(yè)”的重構(gòu)。掌握組件化開(kāi)發(fā)能夠更好的促進(jìn)團(tuán)隊(duì)協(xié)作，提高開(kāi)發(fā)和調(diào)試效率，可維護(hù)性更高。

課程安排：

1、綜合運(yùn)用H5/CSS3/ES6等知識(shí)，使用“組件化的開(kāi)發(fā)思想”重構(gòu)旅游網(wǎng)首頁(yè)

2、了解項(xiàng)目組件化劃分方式

3、了解模塊化與組件化區(qū)別

4、采用模塊化與組件化結(jié)合的開(kāi)發(fā)方式

5、使用Webpack構(gòu)建項(xiàng)目

6、運(yùn)用 art-template 模板引擎，高效開(kāi)發(fā)

7、真實(shí)的數(shù)據(jù)接口，實(shí)現(xiàn)前后臺(tái)聯(lián)動(dòng)

8、通過(guò)自己封裝的Ajax向后端請(qǐng)求數(shù)據(jù)

9、使用Class、Module模塊完成圖的基類，實(shí)現(xiàn)模塊化，提高復(fù)用率

7、移動(dòng)基礎(chǔ)

移動(dòng)開(kāi)發(fā)基礎(chǔ)是進(jìn)行webApp開(kāi)發(fā)。開(kāi)啟前端學(xué)習(xí)的新篇章。通過(guò)移動(dòng)端基礎(chǔ)知識(shí)的學(xué)習(xí)，能夠獨(dú)立實(shí)現(xiàn)適配不同移動(dòng)端終端的頁(yè)面。

課程安排：

1、學(xué)習(xí)移動(dòng)基礎(chǔ)概念

2、理解移動(dòng)端與pc端web開(kāi)發(fā)的區(qū)別

3、掌握移動(dòng)端常用的Rem適配方案

4、掌握Flex布局的使用

5、學(xué)習(xí)響應(yīng)式布局開(kāi)發(fā)

6、不同的適配方法

7、學(xué)習(xí)柵格系統(tǒng)的使用

8、了解移動(dòng)端屏幕、移動(dòng)端瀏覽器、操作系統(tǒng)的不同

8、移動(dòng)進(jìn)階之高效開(kāi)發(fā)

移動(dòng)端高質(zhì)量的開(kāi)發(fā)，是移動(dòng)端開(kāi)發(fā)的必備技能。繼續(xù)移動(dòng)端的學(xué)習(xí)，學(xué)習(xí)移動(dòng)端的事件、開(kāi)發(fā)中的常見(jiàn)問(wèn)題，以及如何使項(xiàng)目的性能更加優(yōu)化。

課程安排：

1、掌握移動(dòng)端常用的事件

2、小案例：移動(dòng)端幻燈片的實(shí)現(xiàn)

3、移動(dòng)端開(kāi)發(fā)中常見(jiàn)的問(wèn)題

4、主流移動(dòng)端頁(yè)面開(kāi)發(fā)技術(shù)選型與解決方案

5、學(xué)習(xí)如何從HTML、CSS、JavaScript三方面優(yōu)化性能

9、項(xiàng)目實(shí)戰(zhàn)：仿窮游移動(dòng)webapp開(kāi)發(fā)

接下來(lái)的一周，我們將迎來(lái)webApp項(xiàng)目的開(kāi)發(fā)，實(shí)現(xiàn)從PC端開(kāi)發(fā)邁向移動(dòng)端。從項(xiàng)目分析、組件劃分、結(jié)構(gòu)搭建、功能實(shí)現(xiàn)、性能優(yōu)化。體驗(yàn)真實(shí)企業(yè)中移動(dòng)端項(xiàng)目的開(kāi)發(fā)流程

課程安排：

1、綜合運(yùn)用H5/CSS3/ES6/移動(dòng)知識(shí)，重構(gòu)旅游網(wǎng)WebAPP的首頁(yè)、目的地頁(yè)

2、符合企業(yè)標(biāo)準(zhǔn)的開(kāi)發(fā)流程，從項(xiàng)目分析、項(xiàng)目搭建、模塊開(kāi)發(fā)到數(shù)據(jù)對(duì)接

3、采用模塊化與組件化結(jié)合的開(kāi)發(fā)方式

4、使用Webpack構(gòu)建項(xiàng)目

5、運(yùn)用 art-template 模板引擎，高效開(kāi)發(fā)。

6、完成 18 個(gè)典型組件開(kāi)發(fā)（搜索、商品、導(dǎo)航等組件）

7、運(yùn)用Swiper高效移動(dòng)端插件開(kāi)發(fā)Banner圖

8、使用Ajax 處理與獲取數(shù)據(jù)

9、如何處理多次請(qǐng)求的解決方案

10、如何運(yùn)用組件化思維，拆分和復(fù)用組件

11、完成各組件性能的優(yōu)化

階段三：小程序與主流框架開(kāi)發(fā)

1、小程序基礎(chǔ)與棧程小程序?qū)崙?zhàn)

開(kāi)始學(xué)習(xí)爆火的輕應(yīng)用開(kāi)發(fā)技術(shù)——小程序 。通過(guò)對(duì)小程序知識(shí)的學(xué)習(xí)，能夠獨(dú)立開(kāi)發(fā)企業(yè)級(jí)小程序，擁有解決主流小程序功能需求的能力。

課程安排：

1、大項(xiàng)目：結(jié)合Flex/Template模板，開(kāi)發(fā)棧程小程序首頁(yè)/活動(dòng)頁(yè)/熱門排行頁(yè)

2、了解小程序注冊(cè)流程/注冊(cè)方式/注冊(cè)主體

3、小程序的全局生命周期和頁(yè)面級(jí)生命周期

4、小程序基礎(chǔ)語(yǔ)法與常用API

5、小程序開(kāi)發(fā)工具的調(diào)試辦法

6、小程序多頁(yè)面下的開(kāi)發(fā)工作流及目錄結(jié)構(gòu)

2、React.js基礎(chǔ)語(yǔ)法與新聞網(wǎng)站實(shí)戰(zhàn)

React.js是企業(yè)開(kāi)發(fā)熱門框架之一 。通過(guò)對(duì)React.js基礎(chǔ)和項(xiàng)目的學(xué)習(xí)，具備構(gòu)建企業(yè)級(jí)項(xiàng)目和解決核心業(yè)務(wù)問(wèn)題的能力，快速接入企業(yè)項(xiàng)目。

課程安排：

1、大作業(yè)：運(yùn)用React組件完成新聞網(wǎng)站項(xiàng)目常見(jiàn)功能開(kāi)發(fā)

2、理解React的開(kāi)發(fā)理念與內(nèi)部原理

3、React的基本使用及Ant Design組件庫(kù)進(jìn)行項(xiàng)目開(kāi)發(fā)

4、使用React封裝項(xiàng)目中用到組件，實(shí)現(xiàn)復(fù)用

5、React項(xiàng)目中常見(jiàn)問(wèn)題的解決方案

6、如何運(yùn)用React-Redux進(jìn)行狀態(tài)管理

7、聲明式編程的思想與組件化開(kāi)發(fā)的思想

3、Sass基礎(chǔ)與Vue.js基礎(chǔ)語(yǔ)法

Vue.js是企業(yè)開(kāi)發(fā)另一熱門框架，易用、靈活、高效，對(duì)于初學(xué)者很友好。通過(guò)對(duì)Vue.js基礎(chǔ)和Sass布局技術(shù)的學(xué)習(xí)，為后續(xù)的全棧項(xiàng)目開(kāi)發(fā)打下基礎(chǔ)。

課程安排：

1、大作業(yè)：訂單列表和購(gòu)物車列表頁(yè)

2、掌握Webpack項(xiàng)目構(gòu)建配置

3、掌握基礎(chǔ)語(yǔ)法與常見(jiàn)API

4、組件的使用及組件的生命周期

5、Axios網(wǎng)絡(luò)請(qǐng)求及路由使用

6、Vuex的引入、應(yīng)用場(chǎng)景及項(xiàng)目中的實(shí)現(xiàn)

7、使用Vue.js技術(shù)棧進(jìn)行項(xiàng)目開(kāi)發(fā)的方式方法

8、掌握Sass布局基礎(chǔ)

4、項(xiàng)目實(shí)戰(zhàn)：Vue.js仿京東到家電商全棧項(xiàng)目前端開(kāi)發(fā)（上）

開(kāi)始進(jìn)入到電商全棧項(xiàng)目開(kāi)發(fā)，首先使用Vue.js前端實(shí)戰(zhàn)的首頁(yè)和商家詳情頁(yè)，還原實(shí)際開(kāi)發(fā)流程，綜合運(yùn)用所學(xué)知識(shí)，完成頁(yè)面開(kāi)發(fā)，掌握開(kāi)發(fā)中常見(jiàn)問(wèn)題解決技巧。

課程安排：

1、綜合運(yùn)用Sass和Vue.js完成登錄頁(yè)/注冊(cè)頁(yè)/首頁(yè)/商家詳情頁(yè)

2、使用vue-cli4.0創(chuàng)建開(kāi)發(fā)環(huán)境

3、使用axios發(fā)送Mock請(qǐng)求

4、使用路由守衛(wèi)實(shí)現(xiàn)基礎(chǔ)登陸校驗(yàn)功能

5、動(dòng)態(tài)路由/異步路由與組件拆分復(fù)用

6、首頁(yè)/商家詳情頁(yè)數(shù)據(jù)渲染

7、Vue.js項(xiàng)目中常見(jiàn)問(wèn)題的解決方案

5、項(xiàng)目實(shí)戰(zhàn)：Vue.js仿京東到家電商全棧項(xiàng)目前端（下）

Vue.js前端項(xiàng)目實(shí)戰(zhàn)的第二部分，實(shí)現(xiàn)電商核心業(yè)務(wù)訂單和地址管理模塊，掌握開(kāi)發(fā)中常見(jiàn)問(wèn)題解決技巧，真實(shí)數(shù)據(jù)訪問(wèn)，開(kāi)發(fā)完整的Vue.js電商前端項(xiàng)目。

課程安排：

1、綜合運(yùn)用Sass和Vue.js完成訂單提交頁(yè)/地址列表頁(yè)/地址編輯/地址新建頁(yè)

2、使用axios發(fā)送Mock 請(qǐng)求

3、動(dòng)態(tài)路由/異步路由與組件拆分復(fù)用

4、訂單提交頁(yè)/地址列表頁(yè)數(shù)據(jù)渲染

5、Vue.js項(xiàng)目中常見(jiàn)問(wèn)題的解決方案

6、步驟大作業(yè)：完成訂單列表頁(yè)和購(gòu)物車列表頁(yè)開(kāi)發(fā)

階段四：Node.js全棧開(kāi)發(fā)

1、全棧必備基礎(chǔ)Node.js

學(xué)前端不至于前端，開(kāi)始學(xué)習(xí)服務(wù)端基礎(chǔ)知識(shí)，掌握什么是服務(wù)端以及服務(wù)端必備node.js，夯實(shí)基礎(chǔ)，邁進(jìn)前端全棧開(kāi)發(fā)。

課程安排：

1、案例：搭建node.js服務(wù)器及創(chuàng)建MongoDB數(shù)據(jù)庫(kù)

2、了解什么是服務(wù)端，服務(wù)端與前端的關(guān)系

3、掌握commonjs模塊化與npm插件使用

4、掌握inspect調(diào)試方法

2、koa2中間件與MongoDB數(shù)據(jù)庫(kù)

真實(shí)企業(yè)開(kāi)發(fā)離不開(kāi)數(shù)據(jù)庫(kù)，Koa2框架有效的提高開(kāi)發(fā)效率，掌握前端必備的前端全棧開(kāi)發(fā)知識(shí)，為后面開(kāi)發(fā)全棧項(xiàng)目蓄力。

課程安排：

1、了解koa2中間件與洋蔥圈模型

2、了解關(guān)系型數(shù)據(jù)庫(kù)與MongoDB基礎(chǔ)API詳解

3、掌握node.js操作MongoDB方法與mongoose規(guī)范數(shù)據(jù)模型

3、項(xiàng)目實(shí)戰(zhàn)：node.js仿京東到家電商全棧項(xiàng)目后端開(kāi)發(fā)

開(kāi)始進(jìn)入到電商全棧項(xiàng)目的后端開(kāi)發(fā)，對(duì)標(biāo)企業(yè)標(biāo)準(zhǔn)開(kāi)發(fā)流程。從登錄實(shí)現(xiàn)方案、項(xiàng)目需求分析、接口和數(shù)據(jù)結(jié)構(gòu)設(shè)計(jì)到業(yè)務(wù)開(kāi)發(fā)，幫你打通前后端任督二脈，突破全棧技術(shù)瓶頸，為就業(yè)加碼。

課程安排：

1、綜合運(yùn)用Node.js+koa2+MongoDB，實(shí)現(xiàn)電商全棧項(xiàng)目的后端

2、掌握企業(yè)的開(kāi)發(fā)流程與技巧，從0到1一步步實(shí)現(xiàn)

3、項(xiàng)目采用前后端分離開(kāi)發(fā)模式

4、核心業(yè)務(wù)的數(shù)據(jù)庫(kù)設(shè)計(jì)與實(shí)現(xiàn)

5、真實(shí)數(shù)據(jù)接口和設(shè)計(jì)與實(shí)現(xiàn)

6、Koa工作流程及常見(jiàn)Koa中間件使用

7、掌握前后端數(shù)據(jù)聯(lián)調(diào)技巧，打通前后的數(shù)據(jù)交互

8、常見(jiàn)MongoDB與nodejs集成

9、了解cookie 和session的關(guān)系

10、大作業(yè)：訂單和購(gòu)物車列表頁(yè)的數(shù)據(jù)庫(kù)和接口設(shè)計(jì)

4、就業(yè)必備基礎(chǔ)技術(shù)面試分析

面試是通往成功就業(yè)的關(guān)鍵一步，包含布局基礎(chǔ)以及JS和ES6等常見(jiàn)考點(diǎn)和經(jīng)典面試題分析，帶你把知識(shí)串成線，掌握前端面試技巧，順利通過(guò)基礎(chǔ)技能面試。

課程安排：

1、H5語(yǔ)義化/CSS布局/定位/圖文樣式/響應(yīng)式面試解題技巧

2、原型和原型鏈的5個(gè)原則與面試解題技巧

3、變量類型/計(jì)算/構(gòu)造函數(shù)的面試解題技巧

4、作用域和閉包的執(zhí)行上下文/this面試解題技巧

5、異步和單線程/常見(jiàn)的內(nèi)置對(duì)象面試解題技巧

6、DOM本質(zhì)/節(jié)點(diǎn)操作/BOM操作面試解題技巧

7、AJAX與事件解面試題技巧

5、就業(yè)必備框架與全棧技術(shù)面試分析

框架、小程序以及全棧相關(guān)內(nèi)容也是面試必考。帶大家梳理的常見(jiàn)考點(diǎn)和經(jīng)典面試題分析，理清面試解題方法，完成最后一厘米的沖刺。

課程安排：

1、Vue.js原理/MVVM面試解題技巧

2、組件生命周期/父子組件傳值面試解題技巧

3、組件異步加載/緩存/抽離公共邏輯面試解題技巧

4、vue-router/data監(jiān)聽(tīng)面試解題技巧+5道Vue.js真題演練

5、React基礎(chǔ)語(yǔ)法/事件面試解題技巧

6、React組件生命周期/父子組件通訊面試解題技巧

7、React函數(shù)組件與class組件區(qū)別面試解題技巧

8、Redux/react-router面試解題技巧