前端是個最近幾年火起來的工種藤韵，而且持續(xù)火熱中，有個詞叫水漲船高熊经，來的人多了荠察，競爭多了，標(biāo)準(zhǔn)也就提高了∧嗡眩現(xiàn)在對前端工程師的要求跟當(dāng)年前已經(jīng)不能同日而語了悉盆。

當(dāng)然了，所謂的趨勢馋吗，不是一天兩天就到來的焕盟，它是未來的一個技術(shù)方向，我們之所以關(guān)注趨勢宏粤，是要關(guān)注變化脚翘，技術(shù)的發(fā)展與普及不是一日之功，一定是慢慢過渡的绍哎，但是你能夠比其他人提前看到方向来农，真正的市場到來的時候，你就可以提前做好準(zhǔn)備崇堰，提前發(fā)掘機(jī)會沃于。

首先，我們從基礎(chǔ)來看海诲，在對2019前端開發(fā)如何進(jìn)階繁莹，提升自己，再做更深一層講解特幔。

1 . 基礎(chǔ)技術(shù)

前端的三大基礎(chǔ)毫無疑問就是HTML咨演、CSS和JS。我稱之為前端的骨蚯斯、肉和魂薄风。

先說“骨”——HTML饵较。HTML,翻譯過來就是超文本標(biāo)記語言，而不是江湖上的HOW TO ML遭赂。方向不能搞錯了循诉，我們整的東西可是老少咸宜的。HTML學(xué)習(xí)最重要的標(biāo)簽的學(xué)習(xí)嵌牺，div打洼、h1-h6龄糊、p逆粹、ul-li、strong炫惩、圖片僻弹、字體等，什么內(nèi)容用什么框.

再說“肉”——CSS他嚷。CSS定義了HTML標(biāo)簽的顯示外觀蹋绽，氣質(zhì)。主要掌握浮動筋蓖，寬高設(shè)置卸耘、顯示屬性等

最后“魂”——Javascript。這是運(yùn)行在瀏覽器上的腳本粘咖，但是現(xiàn)在javascript已經(jīng)遠(yuǎn)遠(yuǎn)不是當(dāng)年的那個js了蚣抗，尤其Ecmascript6標(biāo)準(zhǔn)出來后，nodeJS 橫空出世瓮下，JS暴露出一統(tǒng)天下的野心翰铡，JS讓網(wǎng)頁變得靈活，其實現(xiàn)的每一個明里暗里的交互讽坏，其實是為了觸及您的靈魂锭魔，這也是其成為魂的原因。而現(xiàn)在路呜，CSS3和HTML5的發(fā)展迷捧，又將web推向下一個時代，一個更為豐富多彩的時代胀葱。

2 環(huán)境基礎(chǔ)

設(shè)備党涕、瀏覽器以及工作原理，必須指出的是巡社，html CSS JS都是運(yùn)行在瀏覽器的膛堤，是由瀏覽器負(fù)責(zé)編譯和呈現(xiàn)的。所以必須了解瀏覽器的工作原理晌该。但是瀏覽器千千萬萬肥荔，也不是每個都要去解剖绿渣，主要的有Chrome, Firefox, IE，Safari,Opera,國內(nèi)的主瀏瀏覽器基本是基于chrome內(nèi)核開發(fā)燕耿，做了一些更為接地氣的功能中符，了解下就可以了，主要有QQ瀏覽器誉帅，UC淀散，百度瀏覽器，360瀏覽器蚜锨，搜狗瀏覽器档插，獵豹瀏覽器等。

3 計算機(jī)基礎(chǔ)

計算機(jī)網(wǎng)絡(luò)亚再，http協(xié)議郭膛。既然是web必不可少需要知道計算機(jī)網(wǎng)絡(luò)的知識，這對于網(wǎng)頁的加載和速度優(yōu)化有很大的幫助氛悬，并且则剃，我們做的不是靜態(tài)的頁面，而是動態(tài)的如捅，所以必然涉及到與后臺之間的數(shù)據(jù)的傳輸和存儲棍现，這個是要掌握的。

必須懂：Ajax镜遣，必須會的工具：fiddler

4 流行框架

流行的前端UI框架：

Bootstrap己肮、jQuery UI、Amaze UI

流行的前端框架：

Node.Js

jquery mobile

angular.Js

Vue.js

React.js

5 可視化組件

Echarts

tableau(收費(fèi))

6 新應(yīng)用

針對移動化以及物聯(lián)網(wǎng)方向發(fā)展

7 錦上添花

UI烈涮、 UX 朴肺、交互設(shè)計、 SEO（包括SEM） 坚洽、產(chǎn)品戈稿，更主要一個同理心。好的設(shè)計和交互才能帶來的好的體驗讶舰，贏得用戶鞍盗。

SEO則在推廣層面，好的SEO讓我們以最低的成本跳昼，借力搜索引擎般甲，獲得更加跟多的曝光機(jī)會，畢竟這是個酒香也怕巷子深的時代鹅颊。

最后是產(chǎn)品敷存，站在產(chǎn)品角度，融合（前后端）技術(shù)和商業(yè)堪伍，讓產(chǎn)品產(chǎn)生價值锚烦，實現(xiàn)價值觅闽。

作為一個新興的技術(shù)領(lǐng)域范圍，大前端在不同的語義環(huán)境下涮俄，有著不同的解釋和含義蛉拙，我們以幾個視角去對大前端并做逐一的分析。

Node.js 與前后端分離

在絕大多數(shù)的前端開發(fā)者口中彻亲，大前端有時與 Node.js 一起講孕锄，有時與前后端分離一同講，事實上苞尝，大前端概念也正是由廣大前端開發(fā)者提出的畸肆。

過去幾年，前端技術(shù)經(jīng)歷了爆發(fā)式的發(fā)展野来，這種發(fā)展最重要的推動者之一就是 Node.js恼除。Node.js 為前端建立了與系統(tǒng)之間溝通的橋梁踪旷，從此前端技術(shù)不僅能在服務(wù)端大放異彩曼氛，并且在本地的前端開發(fā)工具與工作流上大展身手，前端從此被解放令野，JavaScript 統(tǒng)治世界的論調(diào)一度甚囂塵上舀患。

不過，當(dāng)人們冷靜之后气破，發(fā)現(xiàn) Node.js 在服務(wù)端并沒有太多的優(yōu)勢聊浅，再加上 Node.js 本身技術(shù)發(fā)展的一些波折，導(dǎo)致它在服務(wù)端的應(yīng)用并不理想现使。但盡管如此低匙，廣大的前端開發(fā)者還是取得了一些階段性勝利，其結(jié)果就是前后端分離碳锈。

在傳統(tǒng) Web 開發(fā)時代顽冶，前端頁面模板是由后端生成的，導(dǎo)致在頁面需要頻繁修改的時候售碳，效率極低强重。前后端分離指的是后端只提供接口，前端對頁面有完整控制贸人，同時通過中間層將前后端隔開间景，在這里對數(shù)據(jù)進(jìn)行抽取、聚合艺智、分發(fā)等操作倘要。這個中間層，通常也是由前端開發(fā)工程師負(fù)責(zé)十拣。

從這種意義上講封拧，大前端的原始定義可以稱為前端技術(shù)的擴(kuò)大化召嘶，包括 Node.js，同時對 Web 頁面有更強(qiáng)的控制權(quán)哮缺，開發(fā)也將承載更多功能的頁面弄跌。

此處劃重點：基于 Node.js 的前后段分離是大前端的重要技術(shù)。

從 Facebook 的 Reactive Native尝苇，再到 Google 的 Flutter铛只，足以看出，起碼對這些科技巨頭們來說糠溜，他們是認(rèn)定這個方向淳玩，并且在投入的，只是當(dāng)下技術(shù)還不夠成熟非竿，所以這類前端跨平臺開發(fā)框架都還不夠普及蜕着，但是你們得相信，這些巨頭的判斷與實力红柱。

再說到國內(nèi)各種平臺的小程序承匣，微信小程序、支付寶小程序等等锤悄，其實都是屬于真正意義的大前端韧骗，所以前端開發(fā)人員，以后的要求會越來越全面零聚，你別覺得不信袍暴，等著未來的發(fā)展就知道了，以后很可能一個前端開發(fā)必須是全棧前端隶症。

所以政模，每一個大前端開發(fā)，最好都懂點前端開發(fā)知識蚂会，而基本的 web 前端開發(fā)基礎(chǔ)就顯得很重要了淋样。

我常遇到一些工作多年的前端工程師，在看到一些我認(rèn)為很基礎(chǔ)的用法時颂龙，發(fā)出驚呼：「怎么還可以這樣」习蓬。

因為很多同學(xué)學(xué)前端的方式是，他們對于知識的理解基本都停留在點上措嵌，從來沒有對前端的知識體系和底層原理形成真正地理解躲叼。

加上前端標(biāo)準(zhǔn)的快速更新，前端工程師的學(xué)習(xí)壓力變得越來越大了企巢。就拿 JavaScript 標(biāo)準(zhǔn)來說枫慷，ES6 中引入的新特性超過了過去十年的總和，新特性帶來的實踐就更多了，僅僅是一個 Proxy 特性的引入或听，就支持了 VueJS 從 2.0 到 3.0 的內(nèi)核原理完全升級探孝。

許多前端程序員都有感觸：學(xué)習(xí)速度跟不上技術(shù)發(fā)展速度，而手忙腳亂誉裆、力不從心顿颅。

這個現(xiàn)象，在一些小公司的前端工程師身上尤為明顯足丢，一些有技術(shù)追求的工程師粱腻，技術(shù)敏感度和主觀能動性都不錯，工作了五六年之后斩跌，逐步走上技術(shù)管理的崗位绍些。但因他們所在公司的業(yè)務(wù)并不復(fù)雜，缺少框架知識積累耀鸦，個人技術(shù)仍處于比較初級的階段柬批。做了管理，技術(shù)沒跟上袖订，還錯過了最佳的學(xué)習(xí)時間贩疙，境遇可想而知诽嘉。

工作壓力大众旗，技術(shù)更迭快岁忘，讓很多前端開發(fā)者高呼「學(xué)不動了」燃观。其實不是你學(xué)不動了未舟，而是你的知識體系底層構(gòu)建出現(xiàn)了問題术瓮。

目前在國內(nèi)雕擂，不少一線互聯(lián)網(wǎng)公司比如美團(tuán)點評冰更、餓了么产徊、網(wǎng)易杭研都有叫大前端的團(tuán)隊或者在對外時使用該稱謂，不過蜀细，由于之前大前端并沒有明確的定義舟铜，這些團(tuán)隊的人員構(gòu)成并不相同，它們都是各個公司在自己對大前端的理解奠衔，以及對公司業(yè)務(wù)的支持需求下設(shè)立的谆刨。具體情況如下（可能有偏差）。