前端工程師需要掌握哪些技能

前言

前端工程師是一個(gè)出現(xiàn)了10年左右，而頗受重視則是最近這五六年的事情。受到重視到前端從業(yè)人員井噴，也就是這一兩年而已。因?yàn)榍岸斯こ處熯@個(gè)職位出現(xiàn)得太晚，導(dǎo)致各大學(xué)校均沒(méi)有系統(tǒng)的相關(guān)教學(xué)，我們所熟知的各個(gè)大牛均是自我研究自我學(xué)習(xí)的。而隨著google推出v8引擎以來(lái)，尤其是gmail對(duì)ajax的應(yīng)用，再隨著jquery的出現(xiàn)，解決了各大瀏覽器的兼容問(wèn)題，而nodejs則將js推向服務(wù)器端，javascript從一個(gè)邊角料的語(yǔ)言變成了一個(gè)性能強(qiáng)勁，前后端通吃的強(qiáng)大語(yǔ)言。

技術(shù)的發(fā)展緊緊是一個(gè)方面，更重要的是這幾年萬(wàn)眾創(chuàng)新，互聯(lián)網(wǎng)+的概念深入人心，因此大量資金涌入互聯(lián)網(wǎng)領(lǐng)域，大量的創(chuàng)業(yè)公司如雨后春筍一樣涌出。大量的公司需要前端工程師的加盟，因此大量后端工程師開(kāi)始轉(zhuǎn)向前端。

而這些后端工程師因?yàn)槠渖詈竦?a href="http://ttokpm.com/v/tag/1315/" target="_blank">編程思想，他們完全無(wú)法忍受毫無(wú)邏輯可言的html+css+js的原始編程狀態(tài)，因此又開(kāi)發(fā)了各種前端工具以及語(yǔ)言。如針對(duì)html的jade模板引擎，針對(duì)于css的less、sass、stylus等。而為了便于項(xiàng)目部署，又有了所謂的amd、cmd標(biāo)準(zhǔn)。一直發(fā)展到browserify、webpack等打包工具。而自從Misko Hevery開(kāi)發(fā)了AngularJS之后，破天荒一樣的整出了雙向綁定的概念，自此，前端江湖真是百花齊放，爭(zhēng)奇斗艷，一發(fā)不可收拾。

暈了，真的暈了。難怪真阿當(dāng)同志在2016年年末在csdn上痛心疾首的指出，這已經(jīng)亂到烏七八糟，再不是他熟悉的那個(gè)親切的前端世界了。世界潮流浩浩蕩蕩，不會(huì)因?yàn)檎姘?dāng)這樣的前朝遺老就停止發(fā)展的步伐。在npm上各種組件、框架、工具每天都在上架，已經(jīng)上架的不斷的在升級(jí)，甚至，有的升級(jí)是以小時(shí)計(jì)！

而由于前兩年前端工程師的緊缺，導(dǎo)致薪資頗為水漲船高，大量不明所以的路人涌入前端行列，以至于在知乎上關(guān)于如何入門前端，前端學(xué)五個(gè)月能不能工作，以及各種咨詢?nèi)绾螐氖虑岸诵袠I(yè)的奇葩問(wèn)題如沙灘的貝殼一樣俯身可拾。

在這混沌亂世，我不禁要問(wèn)，到底什么是前端工程師？到底掌握什么技能才能稱之為前端工程師？

什么是前端工程師？

現(xiàn)在的前端工程涉及的面實(shí)在是太多了。以至于很多人搞不清楚，以為會(huì)點(diǎn)html+css就是前端工程師了。我把前端工程師分為以下兩類：

前前端工程師

此類工程師的工作主要是和設(shè)計(jì)師對(duì)接，將設(shè)計(jì)師的設(shè)計(jì)稿像素級(jí)還原成html+css的網(wǎng)頁(yè)。也就是說(shuō)，很多所謂的老前端工程師，或者自認(rèn)為學(xué)點(diǎn)html就能成為的前端工程師，只不過(guò)是前前端工程師而已。

在html、css、js三門語(yǔ)言中，很多人認(rèn)為困難的是js語(yǔ)言。對(duì)嗎？對(duì)也不對(duì)。

js語(yǔ)言的困難在于他是一門真正的編程語(yǔ)言，所以寫js編程是需要邏輯能力的。而這個(gè)邏輯能力是相當(dāng)一部分人欠缺的。所以認(rèn)為js語(yǔ)言難也就不足為怪了。但是，我認(rèn)為js語(yǔ)言是這三個(gè)語(yǔ)言中最簡(jiǎn)單的。為什么呢？正因?yàn)樗且婚T邏輯語(yǔ)言，所以他是可以推導(dǎo)的。如果你本身邏輯能力不差，又或者學(xué)習(xí)過(guò)其他編程語(yǔ)言，入手js語(yǔ)言并非一個(gè)很困難的事情。

真正的難點(diǎn)在于html、css這兩個(gè)所謂的語(yǔ)言。很多工程師嘲笑前端工程師說(shuō)，html、css算編程語(yǔ)言嗎？

我回答你——不算！

正因?yàn)槠溥壿嫴粡?qiáng)，是一個(gè)非常松散的語(yǔ)言狀態(tài)，才導(dǎo)致其無(wú)比之難。你沒(méi)有什么可以推導(dǎo)的。這樣寫也行，那樣寫也行，無(wú)論怎么寫，只要能實(shí)現(xiàn)效果就行。問(wèn)題是，優(yōu)雅嗎？

好比幾乎所有中國(guó)人都認(rèn)識(shí)3000個(gè)以上的漢字，任憑誰(shuí)都能寫點(diǎn)東西，但是真正能夠讓人感覺(jué)寫得好的，寥寥無(wú)幾。這是兩門感性的語(yǔ)言，和其他編程語(yǔ)言完全不是一碼子事兒，所以，這才是真正的難語(yǔ)言。

有人說(shuō)，實(shí)現(xiàn)效果就行唄！對(duì)，正如我們每個(gè)人都能把話說(shuō)清楚，不求堆砌華麗的辭藻一樣，這樣是能夠與人交流了，上街也能買賣東西做生意。但是，在對(duì)前端工程師要求越來(lái)越高的今年，你還真心以為就會(huì)倆標(biāo)簽div+span就可以給自己戴上一個(gè)所謂的前端工程師的帽子，然后就月薪過(guò)萬(wàn)，當(dāng)上CEO，迎娶白富美走上人生巔峰了嗎？

做夢(mèng)去吧！

如果你邏輯能力確實(shí)不強(qiáng)，但感性，理想化，尤其是文章寫得還不錯(cuò)，如果還是個(gè)愛(ài)浪漫的女生愿意從事前端工作。那么如果你把html+css這兩門語(yǔ)言深入進(jìn)去學(xué)習(xí)，也是頗有可為的。

另外，雖然現(xiàn)在各種前端框架熱火朝天，但是你看看現(xiàn)在主流的大型網(wǎng)站，新浪搜狐網(wǎng)易騰訊，是不是基本上都是老一套，除了頁(yè)面設(shè)計(jì)越來(lái)越美，我沒(méi)見(jiàn)哪個(gè)大型網(wǎng)站會(huì)使用angular、react、vue這些東西。所以前景還是很美好的。

但如果你是個(gè)摳腳丫子的糙漢子，咱還是別了，咱們有重體力活兒可以干！

后前端工程師

什么是后前端工程師？上面的前前端工程師其實(shí)就是原來(lái)的前端工程師，而這兩年炒得火熱的前端工程師實(shí)際上是把原來(lái)屬于后端工程師的活兒給搶過(guò)來(lái)了。所以我把它命名為后前端工程師。

后前端工程師需要至少了解一門后端語(yǔ)言，了解json數(shù)據(jù)交互格式，了解至少一個(gè)前端框架，當(dāng)然js語(yǔ)言基礎(chǔ)絕不能差。了解項(xiàng)目構(gòu)建，路由設(shè)定，數(shù)據(jù)庫(kù)原理，服務(wù)操作等等一系列的基礎(chǔ)知識(shí)。

具體負(fù)責(zé)的工作就是將前前端工程師開(kāi)發(fā)好的網(wǎng)頁(yè)，基于某種前端框架，與后端接口對(duì)接，并部署調(diào)試等。當(dāng)然，在大部分公司，是不會(huì)把前端工程師分成前前端工程師和后前端工程師的，所以，頁(yè)面制作的工作也需要由你來(lái)實(shí)現(xiàn)。

這才使真正的前端工程師。

當(dāng)然，如果你希望往全棧去發(fā)展，那么服務(wù)端Node.js編程也需要掌握，我大前端牛逼啦！站在泰山之巔振臂一呼，還TM有誰(shuí)？！

如果你真心如此牛逼，那早已走上技術(shù)巔峰了。只是，縱觀火熱的前端圈，又有幾人能達(dá)到如此境界呢？高處不勝寒??！

我想從事前端，我該如何入手呢？

首先，基礎(chǔ)的html+css是必須掌握的，就好比學(xué)習(xí)中文一樣，你必須先掌握3000左右的識(shí)字量，才可以說(shuō)略懂中文。但是，在掌握了html+css基礎(chǔ)之后，如何發(fā)展，取決于你自身的特點(diǎn)。

如果你比較年輕，大學(xué)剛畢業(yè)，自認(rèn)為邏輯能力不錯(cuò)！，那么建議直接進(jìn)入后前端的學(xué)習(xí)，深挖js語(yǔ)言，再根據(jù)你所在的公司的實(shí)際情況，選擇一個(gè)主流的前端框架進(jìn)行深入，在js不斷深入的過(guò)程中不斷的開(kāi)發(fā)項(xiàng)目，如果能遇到一個(gè)好的公司，好的團(tuán)隊(duì)，你將快速的提升自己的技術(shù)能力，建議你從后前端的不斷深入，然后不斷提升前前端技能，最終達(dá)到真正的大前端。將來(lái)往全棧發(fā)展都是很有希望的。

如果你比較年輕，喜好文學(xué)，感性浪漫，建議深入學(xué)習(xí)html+css，再附帶了解js語(yǔ)言，如果在一個(gè)不錯(cuò)的團(tuán)隊(duì)中，可以接觸到那些后前端非常厲害的同事，你未必能如它在這些方面如此牛逼，但是你依然可以進(jìn)步不小。不過(guò)，html+css是毫無(wú)捷徑可言的，都是慢慢打磨出來(lái)的實(shí)力。你在js方面可能確實(shí)不如別人，但是要做到，同樣的一個(gè)頁(yè)面，你寫的html+css就是比別人的簡(jiǎn)潔，整齊，優(yōu)雅，那么你自然有你的存身之道。建議從前前端入手，深入后再往后前端靠攏，具體能提升到何種境界，要看你的天賦與努力的。

我是后端工程師轉(zhuǎn)前端，咱別費(fèi)那個(gè)勁了，以你多年的后端經(jīng)驗(yàn)可想而知，你的html+css水平一定是垃圾，就是因?yàn)槟氵@樣的后端工程師的存在，才導(dǎo)致前端工程師奮起爭(zhēng)先，往大前端發(fā)展的。不過(guò)沒(méi)有關(guān)系，你可以揚(yáng)長(zhǎng)避短，利用你無(wú)比牛逼的邏輯能力與后端變成語(yǔ)言天賦，直接入手js語(yǔ)言以及某一個(gè)前端框架。推薦angular或者react。因?yàn)檫@倆框架就是你們后端寫的。你會(huì)無(wú)比親切。至于html+css這種小事情，教給別人去寫啦！當(dāng)然，你還可以深入研究node.js，往服務(wù)端發(fā)展，也是很不錯(cuò)的職業(yè)棧。

我是什么類型的前端？

吹了這么多牛逼，肯定有很多人不服。好，我簡(jiǎn)單說(shuō)下我的情況。

我學(xué)得是中文。前端工程師這塊基本全部自學(xué)，擅長(zhǎng)html+css。目前從事vue技術(shù)棧的開(kāi)發(fā)工作。04年入行從事網(wǎng)頁(yè)切圖仔的工作，國(guó)內(nèi)第一批研究所謂div+css的人。擅長(zhǎng)seo優(yōu)化網(wǎng)站，語(yǔ)義化書寫網(wǎng)頁(yè)。12年以前沒(méi)有關(guān)心過(guò)js語(yǔ)言。

目前在后前端的路上奮起直追。說(shuō)我的前端經(jīng)驗(yàn)，12年從業(yè)。但是真正在js語(yǔ)言上用功，也就是這兩年的事情。所以，我是一個(gè)老菜鳥(niǎo)。