2018年一個合格的前端應該是什麼樣的?

自學轉行已經一年了,目前在一家小公司,基本上是一個人獨立做前端方面的事情,覺得可能和現在主流前端有點脫軌啊,那麼如何成為一個符合主流需求的前端呢?


1。用Parceljs替代webpack並因此在績效評分中碾壓了其他前端配置工程師

2。用typescript替代ES6並趁機吹捧一下自己大學裡學會.NET有多牛逼

3。用webp替代jpg省下公司流量並匿名盜用省下的流量建立http://fuli.com邀請碼30塊錢一個

4。用click大數據日誌說服產品經理放棄50%的需求並把剩下50%的需求把優先順序由紅色改為綠色

5。用canvas來PS自拍並讓自己髮際線離眉毛的距離小於眉毛離鼻孔的距離

6。用EChart繪圖分析比特幣以太幣K線並成功在高位清倉

7。用node+動態代理完成鏈家房源爬蟲並秒殺某性價比房源賺了5年的工資

8。用vue鄙視那些用jquery的人並成功用各種新單詞把搶飯碗的面試者拒之門外

9。用H5表白追到一個設計妹子並受此激勵製作H5在線生成網站又成功撩到了10個HR

10。用年終獎買下100個cherry黑軸機械鍵盤鋪滿客廳並成功提高跪鍵盤的體驗


1 了解ES6的所有新特性

2 熟練使用命令行,包括 gulp webpack vue-cli git

3 理解前端常用設計模式(裝逼辭彙),如閉包、面向對象、MVC、MVVM、單項數據流、路由、單元測試、SSR、義大利麵條、模塊化、組件化、函數式、純函數、高階函數、不可變數據

4 能熟練使用至少一種前端框架,如 vue ng 和 react

5 熟悉 HTTP,了解請求 響應 緩存 代理 反向代理 https 等

6 在 GitHub 至少有一個 star 超過 42 的開源代碼作品(markdown 不算)

這樣的前端,在北上深杭工資 20k 起哦。


別像我這麼水就好

以及我現在做的事情是前端考古

畢竟是一個文史哲見長的學校出來的文科生


可以參見我的另一個回答

曾廣營:前端工程師的深度或者核心競爭力體現在哪裡?


老闆給你個需求,你能說ok,並給出估計完成時間,就夠了。新技術自己玩玩就好,生活沒那麼多要求,都是出來混飯吃的,不丟人。


同小公司出生。

剛開始目標是學學學,學學學,學學學(原諒非科班的我,此處省略無數個學字...)

當時流行的還是jQuery,看源碼,不懂就對著源碼分析文章看。學基礎,學原理,學封裝。

那會做的外包,重複的頁面,相同的樣式,每次都重新思考,提取和重構。

然後換了不是外包的小公司,剛開始用jQuery擼天下,後面接觸了angularJS,重構重構,寫單頁應用,然後慢慢看實現原理。

使用git,後面上了webpack構建,上了es6和babel,使用class和decorator封裝組件,把應用抽象化組件化,定義自己的model層。(當然很多是和後面帶的實習生一起完成的。)

同期學習vue和react,並在幾個管理類的項目中實踐。(小項目,順便用作技術調研)提取vue和react實踐中學到好的思想(組件化),結合組件封裝的配置化思想,同步應用到主打的技術棧angularJS中。

今年年初的目標是,換個大公司,主要為了看看大團隊和用戶量大的業務場景,四月份成功進入。

開始負責某個angular2版本的較大型管理類項目,從beta版本升級到4-rea

lease版本(別提有多少坑了)。同時調研表單配置化(減少開發量),基於當前項目的龐大和歷史遺留兼容問題,寫了demo後中斷了。現在主要負責pc端項目的整理(基於vue),多個平台的合併,組件封裝,構建工具支持多應用,減少維護成本。

明年的目標呀,其實更想把業務應用做好,雖然有研發kpi,只是我希望把接手的東西能完善地整理好,多餘時間再去搞技術需求吧。

但是一些學習還是要保持的,像目前空閑時間會玩一下three,d3,echart,box2d,weex,cyclejs之類,深度調戲下angular和vue,以及惡補非科班缺的東西,更多地拓展視野和思路,豐富自己的腦線圖吧。

感覺好久沒總結下自己了,總之繼續加油,共勉共勉。

-------------------------UPDATED---------------------------

其實付出很多的努力的,熱情更是重要的一部分。

看看我的博客就會明白的:godbasin/godbasin.github.io

-------------------------UPDATED X 2---------------------------

突然很多人關注起了我的博客,然後發現一個挺有意思的事情:

圖1:來自默默無聞騷年的大反擊。

圖2:以前大家都是谷歌搜問題的時候來參觀的,這次都是從知乎進的Github,然後進本騷年的博客的,謝謝惠顧。

圖3:看來大家都是8090後,沒代溝沒代溝(擊掌)。

圖4:嘛,北上廣是程序員的原產地。

當然,日常100+的PV的無名騷年,還是希望能跟大家分享我所看到的世界的。


2017年的入門技能:

1 angular,vue,react任選其一,有全家桶的會全家桶

2 原型鏈,promise等知識點等你來秀

3 移動端開發最好懂一點,性能優化會一些

4 微信小程序可以做一個

5 還是bootstrap

6 還丟不掉jquery

7 自適應和響應式已成標配

8 第三方api的使用日益增長,如微信登錄,分享,百度地圖,支付寶支付,環信im等。

9 原生+html的混搭方案

10 rest 風格的api會成標配

哪些技能要求變弱了:

1.react native的需求在減弱

2. nodejs 的需求在減弱

3.jquery 的需求在減弱

4.h5的離線應用沒有大規模使用,最好用的還是localstorage

5.ie10以下的兼容性要求顯著降低

2018年會什麼樣:

1. 三大框架會勝出一個,或者是優勢盡顯。

2.es6未必會能普及

3.前端環境搭建會簡化簡化簡化,重回到不需太多配置就能跑的清新時代,而不是像現在一樣比java都煩燥

4.演算法切頁面完全可行並最終成為首選

5.api會更規範,會有api建議命名和規範出現,沒有我就自己定一個

6.vr 會歸入前端技能樹


最近公司突然就散了於是就經歷了許多面試,然後才深刻意識到……

並不是所有公司都在用什麼react,angular,vue,也不是所有前端都懂es6,但是相同的是都能出活兒,就是人多少、效率高低,細節和效果好壞的問題……(廢話

會用各種框架固然是好,但是真的能前前後後把各種前端要搞定的或者要配合別人一起搞定的活都收拾乾淨,其實還是一件挺麻煩的事。

而且就算是搞定了各種構建發布之類的事情,你也要思考如何配合其他人,想在舊系統內部引入新框架可能需要什麼工作之類的。

於是,合格的前端到底是個什麼標準?

不明確到具體公司具體項目組的話,鬼知道。

能幹活,能看文檔快速學習,能針對環境選擇正確的技術,能在保證穩定的前提下逐漸引入各類適合項目的技術…之類的?

當然,就我直觀感覺來說……中小公司好像大部分都更青睞於vue的技術棧…學一些終究是沒錯的,最可惜這個也不夠2018……硬要說的話,我感覺pwa說不定快要迎來一波趨勢了?如果想玩新鮮的說不定可以考慮試試這個…?


合格的前端:html, css, jQuery三者掌握就已經合格了,其實前端只要是入門,能夠寫頁面就行。

出色的前端:

Angular:TS,Rx即完全掌握函數式和響應式編程,完全掌握23種設計模式,完全掌握zone原理

React:最新ECMA特性,狀態管理,shadow DOM等前端基礎知識

Vue:快速部署實現

以上客戶端技術任選其一

掌握橋接模式或原生模式的混合應用開發框架:electron,NW,cordova,react-native,nativescript

掌握d3等數據驅動框架

掌握three等requestAnimtaionFrame和3D框架

掌握express,koa等js框架,數量運用promise,async,await,generator,rx等進行後端數據非同步處理,熟悉郵件協議,http,tcp,udp,RTSP等資源流協議

熟練使用MongoDB記錄用戶行為,理解MapReduce架構

數量使用MySQL記錄業務數據,能夠使用Hadoop,Spark等集群計算框架

掌握機器學習相關理論知識,能夠選擇適合的模型在客戶端利用keras.js等張量計算框架進行模型訓練。

這個合格和出色差距還是蠻大的,只是對於我們產品經理來說,只要能幫我們寫網頁就是好前端。

^_^~


這是一個非常主觀的問題,就好比:你覺得一個合格的女朋友/男朋友 應該是怎麼樣的?一樣

這種問題面對不同的人,不同的用人單位,都會得到不同的答案。

而且面對題主的現狀,我覺得根本不存在所謂的「脫軌」。難道大家都會 React,Vue,TS,你不會就算脫軌了?

技術日新月異,每時每刻都有新東西出來,你不可能所有東西都學會,因為你的時間是有限的。

其實題主覺得脫軌,主要是心理上產生的憂慮,而這種憂慮一方面是自己心中沒有一條清楚的技術提升的路,再加上看到來自「媒體」對各類新技術的不斷報到,更加加劇了這種心理上的憂慮。

所以,結合題主的實際情況,我覺得比較可行的辦法是:

1. 一定要搞清楚怎麼樣才是正確的提升自己技術的方式

2. 在時間是有限的這種客觀事實面前,面對新技術我們該如何應對

針對第一點,首先規劃自己近幾年的規劃,如果題主喜歡前端技術,並且打算在這條路上走下去,那麼,我建議你在現有工作的基礎上,擠出時間,多打基礎。不論什麼新技術,本質都是差不多的,搞清楚為什麼!這非常重要。這叫技術功底

面對第二點,時間是有限的,這是事實,但不能成為你不學習新技術的借口,你應該要始終隊新技術保持饑渴,多關注這類新技術,但你沒時間深入,所以需要保持關注+淺嘗輒止。這叫技術視野

一旦面對第一點你的基礎越打越紮實,很多新技術你可能了解一下就明白了它大致的原理。

而對新技術的深入,這是必須要結合實際項目實踐的,所以,必須落實到項目細節中,這種東西完全可以在你未來的企業中去實現。

而事實上,用人單位更多的是考察一個技術人員的技術功底+技術視野。

希望這些話對你能夠有所幫助!謝謝!


有時候也會想,我們作為一個前端,到底應該做什麼,想什麼。

上次寫了一個回答, 馮天然:怎麼提高大家對前端團隊的價值認可?

我想,這些不僅僅是對前端團隊的要求,必然也是對每一個團隊成員的要求。

前端工程師是一個崗位。那麼我們的崗位需求是什麼呢?最簡單的來說,開發網站。

之前有個答主也說了,其實就是高效率的完成工作。

那麼為了完成這個目標我們需要做什麼呢?

  1. 和產品經理,設計人員的良好溝通,可以充分理解對方的想法,精確的還原設計。並且足夠的了解需求和業務,並且可以根據自己的經驗和理解給出合理的意見,幫助完善產品。比如一些埋點設計,前端工程師就可以根據自己的經驗和理解去完善。
  2. 和後端開發人員的良好溝通,了解彼此的開發流程和開發方式,幫助對方更好的完成工作,如果別人有考慮不足的地方,可以提前幫助對方指出。並且在聯調出現問題的時候,可以快速的輔助對方解決問題。
  3. 上線後,保證頁面性能優秀,出現性能問題時可以快速定位並解決問題。可以主動捕獲線上問題並解決問題(當然這個話題展開講細節非常的多)。出現重大問題可以快速回滾。

那麼就這麼幾點,我們應該具備什麼能力?

  1. 對業務有足夠的了解和思考。有一定的交互設計經驗和知識,對產品有主動的關注度。前端是一個很貼近產品的崗位,所以在產品設計的過程中,也可以發揮很多作用。
  2. 對合作夥伴的工作內容和開發模式有足夠的了解。如果你和 native 合作,那你應該要了解 native 的運行機制,可以本地運行對方工程,可以做簡單的修改調試,可以基本看懂對方的開發代碼,要了解對方的技術方案。如果你和後端合作,那你需要了解計算機網路,後端開發模式,後端語言,後端框架。同理,也需要了解對方的技術方案,看懂對方的代碼,可以幫助對方解決問題。
  3. 需要有完善的性能監控工具,並且進行長期持續的關注和維護。有完善的錯誤監控機制,並且及時處理。(還是上面說的,性能監控和錯誤監控的細節點太多,這裡粗略提一下先)。穩定可控的部署開發機制。你也需要了解到自己網站的運行訪問流程,如果出現了問題,到底是哪裡出了問題,dns 解析?nginx?哪一層 nginx?服務節點?都需要對整個工程的運行機制有完整的了解。
  4. 說到性能這點,就要涉及到計算機網路,瀏覽器渲染原理,javascript 基礎等等。
  5. 要有良好的溝通能力,還要有強力的責任心和強大的內心。

正如同我在前端團隊的回答里提到的,當你的同事和兄弟團隊對你有了極高的認可度,覺得你們的前端團隊很穩重,很靠譜。這就是最大的價值了。

同理,如果你的同事,你的產品,你的設計,你的後端夥伴們,跟你合作都很愉快,對方會很認可你的工作。那麼,誰會說你不合格呢?

起碼我感覺我和各類同事的合作都是很愉快的。誰又是誰的敵人呢,大家都想做好自己的工作,既然彼此有著一樣的目標,那麼就可以很愉快的相處。

其實框架這個我不是特別在意。我個人很喜歡用 React。但是團隊用 Vue 也很不錯。工具是用來解決問題的,用一種相對合適的工具來開發就行,並且可以足夠了解所使用的工具,構建完善的周邊設施,幫助團隊變得更好就行了。框架是基礎的延伸,掌握框架並沒有那麼困難。

另外我覺得做東西要先落地,不能多想。永遠不要等一個東西做的不錯才開始用,要先用再讓它變好。

另外我們會遇到很多緊急的,或者複雜的新奇的需求。這也要求我們對於基礎知識有著足夠的了解

起碼我們能確定什麼能做,什麼不能做,為什麼不能做,如何降級。

做的話,遇到問題怎麼更好的解決思考。這都是對於我們基礎素養的要求。但是我覺得這已經是對一個好的前端的要求了。題主的問題是合格嘛~

當然對我來說職業本身不只是工作。更是一種愛好。作為愛好來講,那就有更多的要求了。對於技術要有一種堅持,信仰和浪漫。不過這就是另一個話題了。前端畢竟先是工程師,再是前端。

最後,美團配送技術部前端 北京成都 部門中高級前端招聘中。有興趣的可以給我一份簡歷。fengtianran@meituan.com


能解決問題的。

少吹牛逼多做事,技術是用來解決問題的,技術再好解決不了問題也就是個花瓶。


前端年年區別不大,都是一幫程序員界智商普遍偏低的猿在玩的東西。

只要我不是墊底的智商,還能繼續玩下去。

要是能靠智商碾壓,早就搞大數據分析、演算法工程師,當首席科學家去了,當初不都是走投無路才選擇了前端嗎?

在你曾經走投無路而愛上前端的時候,就註定了你與前端有不可分割的猿糞,無論每年前端會發生什麼變化,他的本質不會變,即使是演算法層面也不會有明顯變化,架構層僅是借鑒了其他編程語言的好,吸取百家之長。

前端現在成了個網紅,化的濃妝,年年換個網紅臉,讓你認不出這到底是誰了。但你只要記住前端三維模型:

前端=html(X)+css(Y)+js(Z)

他可以不斷的演化:

前端=HTML8+css8+js8

2018,別在乎框架會怎麼變,初心不變,熱愛前端,你比別人更熱愛,在自己心中,你就是合格的。

===========================

add 備註:說我是後端的啥意思?我這麼大的簽名寫著大前端工程師看不到?還有啊,前端工程師普遍智商不如演算法工程師是事實,要勇敢面對,別像個花瓶一樣,演算法工程師工資比前端高多少,自認為智商高的話,就去打敗他們,在這裡自欺欺人沒用。最後,我沒說後端的事情,後端工程師不用對號入座。

===========================


紮實的js基礎,以不變應萬變!


說句都不愛聽的話

jQuery依然是主流


2018的要求就是把2017年的東西學懂……


1. 有一定的編程能力(編程思維、數據結構與演算法、設計模式)

2. 對 JavaScript 本身有較深的了解(坑、怎麼避開坑、ES2015+)

3. 對前沿前端生態的了解(A/R/V 等等等等),熟練掌握至少其中一塊

4. 能很熟練地寫 HTML 和 CSS

5. 能用 Node.js 寫點小工具什麼的

第 1 和第 2 點保證你的代碼有較高的質量

第 3 點保證你可以用你熟悉的框架快速開發,並且能快速切換到另一個框架

第 5 點加分

這個是我認為的及格的前端


合格很簡單,能夠「很有效率」的處理掉工作上的一切需求

很有效率 === 不加班 + 干別的有意義的事情

其他有些展示技術棧的裝逼回答,只能說呵呵


2016年, 前端定下了一個小目標, 用彙編寫網頁

2017年, 前端完成了C++ to JavaScript

2018年的目標當然是實現ASM to JavaScript啊

綜上所述, 2018年一個合格的前端應該是熟練掌握彙編語言的前端

以後大概可以這樣寫了:

.data
id byte "userName", 0
.code
mov eax, offset id
call getElementById

其實看起來蠻不錯的 (逃


如果你對什麼是主流感到迷茫,不如看看這個調查 The State of JavaScript 2017: Introductio 以及這篇對 2017 的回望 https://medium.freecodecamp.org/a-look-back-at-the-state-of-javascript-in-2017-a5b7f562e977。

但是拋開所謂對於主流的定義,個人觀點是前端的核心職責始終是為用戶提供良好的界面與交互,不管是在什麼時候,是2018年還是2028年,只要做到了這一點就算合格了。

如果再加一點,我覺得合格的要求還有一個,適應變化的能力

為什麼前端變化快?因為用戶的一直在變,從以前的 PC 到移動端,現在每年出一堆型號的手機,今年視網膜屏、明年齊劉海,加上各種兼容性問題,不能及時響應變化是不行的。更何況那些其它的領域,手錶、電視、眼鏡……過幾年另一個端火了,還得去適應變化。

用戶的需求也在變,從簡單的頁面交互到複雜的應用,一直都在不斷追求更好的用戶體驗。十年前的頁面在現在看來也許很low,但在那時也是合格的,因為需求就是那樣。

為什麼框架工具層出不窮學不過來?因為需求導致應用的複雜度上升了,需要框架工具管理和控制複雜度。就像以前原始人吃生肉可能就能充饑,現在人的口味刁鑽了,對食物的需求更複雜了,廚師不把各種工具練熟怎麼做出好菜,滿足刁鑽的食客?

但是會什麼框架和工具不應該成為評價一個前端是否合格的標準,因為沒有什麼是脫離環境能講的。假如所在的公司還在用一個很老的框架,但是只要它能持續維護並且保證需求實現,那麼就沒有問題。每個框架工具也都有其使用的場景,所有脫離環境談這些的都是扯淡。

學習XX框架工具不一定能幫助你成為一個合格的前端。老老實實地研究框架工具解決了什麼問題、適用於什麼場景,在適當的時候採用它,這樣可能更有幫助。

回到合不合格的問題還是那句話,搞定用戶,搞定最核心的需求。但是在前端界發展的過程中,持續變化才是唯一不變的東西吧...今年合格,明年就不一定了。至於如何適應變化,就得靠個人結合自身所處的環境去思考了。


推薦閱讀:

2016 年的今天,Angular 1 還有什麼使用價值?
如何評價阿里巴巴最近開源的ANT DESIGN PRO?
前端 ,後端 關於數據交互的問題?
什麼樣的前端才是大公司要的前端?
antd走過了那些坑?

TAG:前端開發 | HTML5 | Nodejs | MVC | 前端框架 |