WEB前端在編程界已經(jīng)是非常根深蒂固，其發(fā)展也是異常寬廣。

? ? ? 在早期的web應(yīng)用主要是靜態(tài)頁面的瀏覽，這些靜態(tài)頁面使用HTML語言編寫，放在服務(wù)器上，用戶使用瀏覽器通過HTTP協(xié)議請求服務(wù)器上的web頁面，服務(wù)器上的web服務(wù)器軟件接受到用戶發(fā)送的請求后，讀取請求URI所標(biāo)識的資源，加上消息包頭發(fā)送給客戶端的瀏覽器，瀏覽器解析響應(yīng)中的HTML數(shù)據(jù)，隨后向用戶呈現(xiàn)多姿多彩的HTML頁面。

但是隨著網(wǎng)絡(luò)的發(fā)展，很多線下業(yè)務(wù)開始向網(wǎng)上發(fā)展，WEB前端技術(shù)順應(yīng)時(shí)代的變化由：單機(jī)程序——>網(wǎng)絡(luò)程序——>主機(jī)+終端模式——>更新迭代到現(xiàn)在的：c/s架構(gòu) 模式

現(xiàn)如今前端也不再是全部依賴于瀏覽器，而使用 native實(shí)現(xiàn)的原生 App 也是越來越多公司的選擇。所以，就催生出了幾種web端就業(yè)方向：前端開發(fā)工程師、小程序開發(fā)工程師、高級前端開發(fā)工程師、前端架構(gòu)師、高級前端架構(gòu)師。

任何應(yīng)用的實(shí)現(xiàn)都少不了WEB前端的身影，技術(shù)實(shí)現(xiàn)的結(jié)果需要展示給用戶，如何給用戶呈現(xiàn)出豐富且合理的應(yīng)用界面，WEB前端工程師功不可沒；

WEB前端就業(yè)方面的又是什么樣的環(huán)境呢？

其實(shí)WEB前端在就業(yè)方面空缺甚至比后端開發(fā)人員還要大，因?yàn)橛捎赪EB前端工程師需要掌握的技術(shù)魚龍混雜，技術(shù)參差不齊，導(dǎo)致大家對前端行業(yè)開始有所疑問，求職人員抱怨前端人數(shù)太多，HR 抱怨合適的前端為什么這么難找！? 形成非常尷尬的局面

由于市面上前端的學(xué)習(xí)資料都是異常的雜亂；

新春來臨之際，UP在這里為大家加點(diǎn)料：

前端基礎(chǔ)體系、前后端交互體系、WEB前沿技術(shù)體系、工程化體系、前端三大框架體系、微信相關(guān)體系、HTML5新特性體系

主攻進(jìn)階三大交互層：

前端交互層

交互層可以理解為特效，我們需要能實(shí)現(xiàn)頁面的各種特效，以滿足目前站點(diǎn)的需求，例如動畫、過渡、圖形繪制等

前端邏輯層

前端邏輯層主要體現(xiàn)在前端的渲染問題，我們都知道，目前都是前后端分離或者混合開發(fā)，這無疑都是需要前端來進(jìn)行渲染的。也就是我們要考慮的是：模板+數(shù)據(jù)=頁面

服務(wù)器層

作為一名優(yōu)秀的前端開發(fā)者，你需要掌握服務(wù)器相關(guān)內(nèi)容，node 則是我們的首選，我們需要構(gòu)建前端工程化，需要服務(wù)器端支持做渲染甚至需要具有完整服務(wù)器端開發(fā)的能力。

二十四個(gè)知識模塊

1、HTML5+CSS3模塊

2、移動端M站模塊

3、JavaScript編程模塊

4、jQuery模塊

5、BootStrap模塊

6、HTML5新特性模塊

7、Nodejs、MySQL與Ajax模塊

8、模塊化模塊

9、JavaScript新標(biāo)準(zhǔn)(ES6\7\8\9)

10、工程化模塊

11、小程序模塊

12、React模塊

13、React輕量級框架之DvaJS

14、React輕量級框架之UmiJS

15、Vue模塊

16、Angular模塊

17、框架原理模塊

18、UI組件庫模塊

19、協(xié)同開發(fā)模塊

20、大數(shù)據(jù)可視化模塊

21、微信相關(guān)模塊

22、WebApp與混合開發(fā)模塊

23、React-Native模塊

24、Flutter模塊

企業(yè)級項(xiàng)目

1.小米商城官網(wǎng)

項(xiàng)目簡介：首先選擇小米官網(wǎng)為第一個(gè)實(shí)戰(zhàn)案例，是因?yàn)閯傞_始入門，有個(gè)參考點(diǎn)，另外站點(diǎn)比較偏向目前的卡片式設(shè)計(jì)，實(shí)現(xiàn)常見效果。目的為學(xué)者練官網(wǎng)，熟悉 div+css 布局。

采用技術(shù)棧：HTML+CSS+Div布局

2.響應(yīng)式官網(wǎng)

此站點(diǎn)特效較多，所以通過練習(xí)編寫次站點(diǎn)，學(xué)生可以更多練習(xí) CSS3 的新特性過渡與動畫的實(shí)現(xiàn)，并且可以很好的練習(xí) div+css 布局。

采用技術(shù)棧：HTML+CSS+Div布局

3.課程類官網(wǎng)

此站點(diǎn)為響應(yīng)式站點(diǎn)，在目前常見站點(diǎn)中，響應(yīng)式設(shè)計(jì)類站點(diǎn)是非常多的，而且大部分公司的站點(diǎn)都需要支持響應(yīng)式，所以，通過練習(xí)次站點(diǎn)，學(xué)者可以熟悉響應(yīng)式這點(diǎn)的設(shè)計(jì)流程和實(shí)現(xiàn)方式

技術(shù)棧：HTML5+CSS3+BootStrap

4.美食網(wǎng)(移動端)

項(xiàng)目為移動端項(xiàng)目，針對 M 站進(jìn)行布局處理，項(xiàng)目為手機(jī)外派類 web 站點(diǎn)，功能包含，首頁店鋪展示，店鋪餐飲列表，具體視頻詳情等頁面

技術(shù)棧：HTML5+CSS3+REM

5.網(wǎng)易云音樂

本項(xiàng)目為移動端網(wǎng)易云音樂 WebApp，包含推薦音樂、熱歌榜、新歌榜、搜索、上拉加載、歌曲播放、歌詞同步等功能。主要讓學(xué)生掌握前后端數(shù)據(jù)交互、移動端布局處理等

6.登陸注冊認(rèn)證系統(tǒng)

登錄認(rèn)證系統(tǒng)基本上是每個(gè)項(xiàng)目的必備品，我們單獨(dú)拿出來，做詳細(xì)講解，并形成一個(gè)獨(dú)立的項(xiàng)目，這樣大家在日后的開發(fā)中，可以隨時(shí)可拔插式增加到自己的項(xiàng)目中

技術(shù)棧：React + Redux + React-Router + BootStrap + Axios + Redux-Thunk + 工具庫(lodash\classnames 等)

等等

作為IT人，我們也在不斷地要求自己，為學(xué)員做出更多更好的視頻課程；這次的課程我們集合了2020年所有新型的前端技術(shù)，整理出了適合廣大學(xué)員學(xué)習(xí)的web前端課程，與以往相比，內(nèi)容更加豐富，極力保證學(xué)員所學(xué)技術(shù)緊跟時(shí)代步伐！