大家好睡腿，我是李俊輝语御！如果您覺得文章有用峻贮，請(qǐng)幫忙點(diǎn)個(gè)贊或關(guān)注，也為我鼓勵(lì)一下应闯，堅(jiān)持寫下去纤控！

前端開發(fā)應(yīng)該學(xué)習(xí)什么技術(shù)才能成為大牛？做前端開發(fā)的同學(xué)應(yīng)該都知道碉纺，前端涵蓋的知識(shí)面實(shí)在太多太雜船万，讓學(xué)習(xí)前端的人有點(diǎn)二和尚摸不到頭腦的感覺，學(xué)習(xí)了很久也不清楚自己的水平到底離大牛還差多遠(yuǎn)骨田。
最近閑下來沒事仔細(xì)思考整理了一個(gè)大牛的前端到底應(yīng)該會(huì)哪些技術(shù)以及相應(yīng)的匹配的薪水范圍耿导。讓你對(duì)自己目前擁有的技術(shù)能力對(duì)應(yīng)社會(huì)薪資價(jià)值有一個(gè)清楚的參照。同時(shí)也對(duì)前端宏觀整理一下知識(shí)類別盛撑，有的同學(xué)東學(xué)一點(diǎn)西學(xué)一點(diǎn)碎节，知識(shí)不能夠成體系發(fā)展。看完這篇文章以后你會(huì)清楚的知道以后再學(xué)的任何前端技術(shù)知識(shí)是彌補(bǔ)了你的哪部分技術(shù)空白抵卫。

神級(jí)前端大牛應(yīng)具備26類技術(shù)內(nèi)容狮荔，全部掌握可以橫行天下。

主要前端技術(shù)：

1介粘、實(shí)際業(yè)務(wù)相關(guān)理論基礎(chǔ)知識(shí)和經(jīng)驗(yàn)（http1.1與http2.0協(xié)議區(qū)別殖氏、瀏覽器渲染機(jī)制、Event Loop事件隊(duì)列循環(huán)機(jī)制姻采、事件委托/代理雅采、token / session / cookie作用及應(yīng)用場景、jsScope作用域鏈慨亲、跨域多種實(shí)現(xiàn)方法婚瓜、頁面優(yōu)化手段（雅虎35條軍規(guī)、緩存知識(shí)刑棵、Gzip巴刻、preload、prefetch等）蛉签、如何線上部署等...）
2胡陪、css布局基礎(chǔ)知識(shí)（rem、viewport（vw vh）碍舍、less / sass柠座、清除浮動(dòng)、BFC片橡、自適應(yīng)/響應(yīng)式布局妈经、如何實(shí)現(xiàn)縱橫比布局、flex理解和用法等...）
3、JS語言基礎(chǔ)知識(shí)（繼承都有哪些方法狂塘、什么叫閉包及應(yīng)用場景录煤、函數(shù)防抖&函數(shù)截流、異步promise荞胡、async/await、xmlHttpRequest / ajax / fetch / axio請(qǐng)求數(shù)據(jù)了嚎、文件及二進(jìn)制數(shù)據(jù)操作泪漂、TypeArray、websocket詳細(xì)知識(shí)歪泳、canvas一些api知識(shí)萝勤、正則表達(dá)式等...）
4、常用框架（vue呐伞、vue-router敌卓、vuex、react伶氢、react-router趟径、redux、mobx癣防、mobx-state-tree蜗巧、elementUI、iVeiw蕾盯、materialUI幕屹、Ant Design等...）
5、測試框架（jest级遭、mocha等...）
6望拖、構(gòu)建與部署（webpack、gulp等...）
7挫鸽、Git版本控制使用（git基礎(chǔ)命令说敏，GitHub Actions工具等...）
8、動(dòng)畫相關(guān)知識(shí)(css animator 掠兄、requstAnimationFrame像云、動(dòng)畫庫等...)
9、算法知識(shí)相關(guān)內(nèi)容（冒泡排序蚂夕、快速排序迅诬、各種排序、字符串模糊查詢等...)

上面的主要技術(shù)內(nèi)容全部掌握后婿牍，基本上可以說是一個(gè)高手了侈贷。北京上海月薪15-35K應(yīng)該不成問題（視技術(shù)掌握程度+運(yùn)氣+自我要求+勇氣+行業(yè)大環(huán)境）。但是還想成為前端大牛，那還需要掌握下面的技術(shù)內(nèi)容俏蛮。

進(jìn)階前端技術(shù)：

1撑蚌、多端小程序（微信小程序基礎(chǔ)開發(fā)、公眾號(hào)jssdk搏屑、Wepy争涌、Taro、mp-vue辣恋、等...）
2亮垫、數(shù)據(jù)可視化（Echart、D3等...）
3伟骨、Native App原生開發(fā)（react navtive饮潦、flutter等...）
4、eletron（桌面開發(fā)）
5携狭、微前端知識(shí)（多項(xiàng)目共同組件继蜡、多項(xiàng)目通信、多項(xiàng)目集合等...）
6逛腿、視頻直播相關(guān)（WebRTC稀并、ffmpeg、rtsp鳄逾、Rmmv直播等...）
7稻轨、3D開發(fā)（webGL、three.js等...）
8雕凹、設(shè)計(jì)模式(工廠模式殴俱、單例模式、觀察者模式枚抵、訂閱模式等...)
9线欲、SEO搜索相關(guān)知識(shí)（sitmap、roobot汽摹、關(guān)鍵詞密度工具李丰、模擬蜘蛛工具、預(yù)渲染/無頭瀏覽器/Puppeteer逼泣、Nuxt趴泌、Next服務(wù)端渲染等...）
10、pwa相關(guān)知識(shí)（次要拉庶，目前沒有太大的需求）
11嗜憔、數(shù)據(jù)結(jié)構(gòu)知識(shí)（隊(duì)列、棧氏仗、鏈表吉捶、集合、hash表、樹呐舔、圖等...）币励，不過這個(gè)是次要的，不用花費(fèi)太多精力珊拼，但是腦中要理解和實(shí)戰(zhàn)中能夠運(yùn)用食呻。

掌握了上面的主要和進(jìn)階共20項(xiàng)技術(shù)后，完全可以說自己是一個(gè)前端大牛了澎现。北京上海月薪35K-60K應(yīng)該不成問題（視技術(shù)掌握程度+運(yùn)氣+自我要求+勇氣+行業(yè)大環(huán)境）搁进。
但是想成為神級(jí)大牛，那還不夠昔头！對(duì)，你沒聽錯(cuò)影兽，學(xué)了這么多也還不夠＝腋！峻堰！

不屬于前端開發(fā)讹开，但是高手也需要掌握的技術(shù)：

一個(gè)神級(jí)前端大牛還需要掌握一些后端和運(yùn)維相關(guān)技術(shù)，這樣在你承擔(dān)大型重要任務(wù)時(shí)捐名，和其他配合團(tuán)隊(duì)能夠溝通起來相互理解彼此的意思旦万，不讓公司團(tuán)隊(duì)走彎路浪費(fèi)人員時(shí)間成本，快速制定出技術(shù)開發(fā)镶蹋、用戶體驗(yàn)成艘、環(huán)境安全等相對(duì)較高的方案。
例如：如果你不懂運(yùn)維基礎(chǔ)知識(shí)贺归，當(dāng)你開發(fā)完成做線上部署時(shí)淆两，如何告訴運(yùn)維人員你的靜態(tài)文件要怎么部署？緩存要怎么設(shè)置拂酣？代理如何設(shè)置秋冰？甚至有的公司需要前端自己來做持續(xù)構(gòu)建和持續(xù)部署（CI / CD），jenkins如何配置婶熬，等等...剑勾。你自己都說不清楚，如何讓運(yùn)維人員理解你的部署需求? 結(jié)果只能彼此相互扯皮赵颅，大量做試驗(yàn)性工作虽另，最終結(jié)果還不一定是最優(yōu)方案。

所以一個(gè)真正的前端大牛性含，還必須掌握如下6點(diǎn)：

1洲赵、后端語言（python、nodejs、koa2叠萍、Express芝发、阿里Egg、Nunjucks苛谷、Ejs等...）
2辅鲸、服務(wù)器軟件（Nginx、Apache等...)
3腹殿、數(shù)據(jù)庫語言（mangoDB独悴、mysql等...)
4、GraphQL api查詢描述語言锣尉，精簡api數(shù)據(jù)精準(zhǔn)查詢刻炒，Restful api查詢標(biāo)準(zhǔn)等
5、 AST / DSL抽象語法樹相關(guān)內(nèi)容自沧，可寫插件及虛擬機(jī)編譯器等
6坟奥、運(yùn)維相關(guān)知識(shí)（linux基礎(chǔ)、jenkins自動(dòng)化部署拇厢、Docker爱谁、K8、容器等...）

除了上面提到的技術(shù)內(nèi)容孝偎，在此基礎(chǔ)上還有一項(xiàng)更重要的访敌，就是豐富的開發(fā)經(jīng)驗(yàn)、業(yè)務(wù)案例衣盾、大廠經(jīng)驗(yàn)寺旺、團(tuán)隊(duì)經(jīng)驗(yàn)、管理經(jīng)驗(yàn)等雨效。

好了迅涮，以上就是李俊輝為您整理的神級(jí)前端大牛必會(huì)的26類技術(shù)，但是現(xiàn)實(shí)中不一定非要按順序?qū)W習(xí)掌握徽龟，完全可以學(xué)習(xí)基礎(chǔ)知識(shí)叮姑、部分框架，學(xué)習(xí)微信小程序据悔，學(xué)些后端传透，學(xué)習(xí)nginx等來應(yīng)對(duì)工作中的實(shí)際情況，也一樣是一個(gè)高手极颓，但是神級(jí)朱盐？還是都掌握吧，北京上海月薪60k-120k不成問題（視技術(shù)掌握程度+運(yùn)氣+自我要求+勇氣+行業(yè)大環(huán)境）菠隆。

順便說一下兵琳，寫文章真累呀狂秘，還浪費(fèi)時(shí)間，真佩服那些寫長篇幅文章貢獻(xiàn)社會(huì)的人躯肌。不過也為自己又重新整理了一下思路者春，還能有大大的滿足感。

如果您覺得文章有用清女，請(qǐng)幫忙點(diǎn)個(gè)贊或關(guān)注钱烟，也為我鼓勵(lì)一下，堅(jiān)持寫下去嫡丙，在此感謝??拴袭！

轉(zhuǎn)載一定注明出處！
原文地址：http://www.reibang.com/p/d274104e099e
2020年2月7日 新冠狀病毒期間憋在家