分享前還是先分享自己的web前端學習交流群：614315657群內不定時分享乾貨， 包括2017最新的web前端企業案例學習資料和零基礎入門教程， 歡迎初學和進階中的小夥伴入群學習交流
面向2018年， 我覺得前端有這麼三個方向能夠打破
前端邏輯層（包括三大結構， webpack， 前端資料管理）
前端交互層（包括css3， canvas， svg， vr等， 以及對應功能優化）
node伺服器層 （即伺服器領域， 以及前端開發工具的開發）
當然還能夠說， 有electron這樣開發桌面使用的， 但是我覺得大部分人的規劃仍是在web領域領域的。
一、前端邏輯層
前端邏輯層處理的問題：前端的烘托問題。
其實就是， 從後端拿到的各種資料（資料庫的結構化資料， 各種資料）， 如何組合成頁面元素。
前端的烘托， 其實就是 範本+資料 = 頁面
① html 負責結構
② css 負責款式
③ js 負責邏輯
只有範本沒有後端資料的頁面我們能夠瞭解為靜態頁面
而我們現在幹流的三大結構， 則提供 範本與資料之間的映射聯繫。
在邏輯層的研討， 首要就是學習並熟練三大結構： Vue, React, Angular
這一塊是我們90%前端， 日常工作的首要部分。 也是很多公司面試會去重點考察的內容。
可是， 現在的行情現已不是， 你會個新結構就能夠固執拿OFFER的時期了。
前端的井噴的情況下，
能夠深挖的部分
①結構部分： 舉個例子， 如 Vue+ Vuex+ Vue-router+axios的全家桶
react和angular的也相似， 有這麼一套全家桶。
要想在前端競爭中取得優勢， 需求在這些結構的原理上深挖。
研討： a. 源碼和完成原理 （理論）
b. 常見的使用場景和常見問題的完成 （經驗） c. 同類問題的橫向對比（比如用了vuex 需求瞭解一下 redux是怎樣完成的）
②構建部分： webpack + npm/yarn + 腳手架（如vue-cli） +sass
構建部分， 其實是一塊很簡單出區分度的領域。 你研討透一點， 你就越能駕馭住項目的改變。
研討： a. webpack的裝備和對應使用場景
b. npm的指令使用， 以及一些高級的用法（架起私有npm或許自己寫全域包等） c. 腳手架快速建立的過程， 以及怎麼自訂更改 d. 怎麼裝備eslint和單元測試等
③代碼標準部分： es6 + ts + css標準 等等等
代碼標準不多說， 前端的js和css都是規劃得很粗糙的語言。 如果你想hold住更大型的項目， 那麼標準是你不可忽視的地方。
邏輯層部分， 是我們通常意義上瞭解的前端本職。
篇幅有限， 今天先分享這麼多， 如果大家喜歡的話我會再更新， 專注學習web前端技術的小夥伴可以進群（614315657）一起交流學習，