
開篇
前端開發(fā)是一個非常特殊的行業(yè),它的歷史實際上不是很長,但是知識之繁雜,技術(shù)迭代速度之快是其他技術(shù)所不能比擬的。
winter在他的《重學(xué)前端》課程中提到:
到現(xiàn)在為止,前端工程師已經(jīng)成為研發(fā)體系中的重要崗位之一。可是,與此相對的是,我發(fā)現(xiàn)極少或者幾乎沒有大學(xué)的計算機(jī)專業(yè)愿意開設(shè)前端課程,更沒有系統(tǒng)性的教學(xué)方案出現(xiàn)。大部分前端工程師的知識,其實都是來自于實踐和工作中零散的學(xué)習(xí)。
這樣是一個非常真實的現(xiàn)狀,實際上很多前端開發(fā)者都是自學(xué)甚至轉(zhuǎn)行過來的,前端入門簡單,學(xué)習(xí)了幾個API以后上手做項目也很簡單,但是這往往成為了限制自身發(fā)展的瓶頸。
只是停留在會用階段是遠(yuǎn)遠(yuǎn)不夠的,我們還需要不斷探索和深入?,F(xiàn)在市面上并不缺少學(xué)習(xí)教程,技術(shù)文章,如果盲目的學(xué)習(xí)你會發(fā)現(xiàn)看過以后的知識留存率會很低,而且發(fā)現(xiàn)沒有了解到的知識越來越多,這會讓人產(chǎn)生焦慮。
實際上,除了堅持學(xué)習(xí)的強(qiáng)大的自驅(qū)力,你還需要一個很簡單的學(xué)習(xí)方法。那就是:建立自己的知識體系。它能幫助你更系統(tǒng)性的學(xué)習(xí),同時你也時刻能知道自己哪些地方是不足的。
我會把我工作和學(xué)習(xí)中接觸到的知識全部歸納到我的知識體系中,其中不僅僅包括我已經(jīng)學(xué)過的,還有很多我沒有來得及學(xué)習(xí)的。
這不僅僅是我的知識體系,更是我時刻提醒自己的自檢清單。
下面我會把我的自檢清單分享給大家,你可以按照清單上的知識檢測自己還有哪些不足和提升,我也建議大家建自己的知識體系,這樣工作或者學(xué)習(xí)甚至面試時,你能快速定位到知識清單中的點,如果你有哪些我沒歸納到的點,歡迎在評論區(qū)告訴我。

一、JavaScript基礎(chǔ)
前端工程師吃飯的家伙,深度、廣度一樣都不能差。
變量和類型
1.
JavaScript規(guī)定了幾種語言類型2.
JavaScript對象的底層數(shù)據(jù)結(jié)構(gòu)是什么3.
Symbol類型在實際開發(fā)中的應(yīng)用、可手動實現(xiàn)一個簡單的Symbol4.
JavaScript中的變量在內(nèi)存中的具體存儲形式5.基本類型對應(yīng)的內(nèi)置對象,以及他們之間的裝箱拆箱操作
6.理解值類型和引用類型
7.
null和undefined的區(qū)別8.至少可以說出三種判斷
JavaScript數(shù)據(jù)類型的方式,以及他們的優(yōu)缺點,如何準(zhǔn)確的判斷數(shù)組類型9.可能發(fā)生隱式類型轉(zhuǎn)換的場景以及轉(zhuǎn)換原則,應(yīng)如何避免或巧妙應(yīng)用
10.出現(xiàn)小數(shù)精度丟失的原因,
JavaScript可以存儲的最大數(shù)字、最大安全數(shù)字,JavaScript處理大數(shù)字的方法、避免精度丟失的方法
原型和原型鏈
1.理解原型設(shè)計模式以及
JavaScript中的原型規(guī)則2.
instanceof的底層實現(xiàn)原理,手動實現(xiàn)一個instanceof4.實現(xiàn)繼承的幾種方式以及他們的優(yōu)缺點
5.至少說出一種開源項目(如
Node)中應(yīng)用原型繼承的案例6.可以描述
new一個對象的詳細(xì)過程,手動實現(xiàn)一個new操作符7.理解
es6 class構(gòu)造以及繼承的底層實現(xiàn)原理
作用域和閉包
1.理解詞法作用域和動態(tài)作用域
2.理解
JavaScript的作用域和作用域鏈3.理解
JavaScript的執(zhí)行上下文棧,可以應(yīng)用堆棧信息快速定位問題4.
this的原理以及幾種不同使用場景的取值5.閉包的實現(xiàn)原理和作用,可以列舉幾個開發(fā)中閉包的實際應(yīng)用
6.理解堆棧溢出和內(nèi)存泄漏的原理,如何防止
7.如何處理循環(huán)的異步操作
8.理解模塊化解決的實際問題,可列舉幾個模塊化方案并理解其中原理
執(zhí)行機(jī)制
1.為何
try里面放return,finally還會執(zhí)行,理解其內(nèi)部機(jī)制2.
JavaScript如何實現(xiàn)異步編程,可以詳細(xì)描述EventLoop機(jī)制3.宏任務(wù)和微任務(wù)分別有哪些
4.可以快速分析一個復(fù)雜的異步嵌套邏輯,并掌握分析方法
5.使用
Promise實現(xiàn)串行6.
Node與瀏覽器EventLoop的差異7.如何在保證頁面運行流暢的情況下處理海量數(shù)據(jù)
語法和API
1.理解
ECMAScript和JavaScript的關(guān)系2.熟練運用
es5、es6提供的語法規(guī)范,3.熟練掌握
JavaScript提供的全局對象(例如Date、Math)、全局函數(shù)(例如decodeURI、isNaN)、全局屬性(例如Infinity、undefined)4.熟練應(yīng)用
map、reduce、filter等高階函數(shù)解決問題5.
setInterval需要注意的點,使用settimeout實現(xiàn)setInterval6.
JavaScript提供的正則表達(dá)式API、可以使用正則表達(dá)式(郵箱校驗、URL解析、去重等)解決常見問題7.
JavaScript異常處理的方式,統(tǒng)一的異常處理方案
二、HTML和CSS
HTML
1.從規(guī)范的角度理解
HTML,從分類和語義的角度使用標(biāo)簽2.常用頁面標(biāo)簽的默認(rèn)樣式、自帶屬性、不同瀏覽器的差異、處理瀏覽器兼容問題的方式
3.元信息類標(biāo)簽(
head、title、meta)的使用目的和配置方法4.
HTML5離線緩存原理5.可以使用
Canvas API、SVG等繪制高性能的動畫
CSS
1.
CSS盒模型,在不同瀏覽器的差異2.
CSS所有選擇器及其優(yōu)先級、使用場景,哪些可以繼承,如何運用at規(guī)則3.
CSS偽類和偽元素有哪些,它們的區(qū)別和實際應(yīng)用4.
HTML文檔流的排版規(guī)則,CSS幾種定位的規(guī)則、定位參照物、對文檔流的影響,如何選擇最好的定位方式,雪碧圖實現(xiàn)原理5.水平垂直居中的方案、可以實現(xiàn)
6種以上并對比它們的優(yōu)缺點6.
BFC實現(xiàn)原理,可以解決的問題,如何創(chuàng)建BFC7.可使用
CSS函數(shù)復(fù)用代碼,實現(xiàn)特殊效果8.
PostCSS、Sass、Less的異同,以及使用配置,至少掌握一種9.
CSS模塊化方案、如何配置按需加載、如何防止CSS阻塞渲染10.熟練使用
CSS實現(xiàn)常見動畫,如漸變、移動、旋轉(zhuǎn)、縮放等等11.
CSS瀏覽器兼容性寫法,了解不同API在不同瀏覽器下的兼容性情況12.掌握一套完整的響應(yīng)式布局方案
手寫
1.手寫圖片瀑布流效果
2.使用
CSS繪制幾何圖形(圓形、三角形、扇形、菱形等)3.使用純
CSS實現(xiàn)曲線運動(貝塞爾曲線)4.實現(xiàn)常用布局(三欄、圣杯、雙飛翼、吸頂),可是說出多種方式并理解其優(yōu)缺點
三、計算機(jī)基礎(chǔ)
關(guān)于編譯原理,不需要理解非常深入,但是最基本的原理和概念一定要懂,這對于學(xué)習(xí)一門編程語言非常重要
編譯原理
1.理解代碼到底是什么,計算機(jī)如何將代碼轉(zhuǎn)換為可以運行的目標(biāo)程序
2.正則表達(dá)式的匹配原理和性能優(yōu)化
3.如何將
JavaScript代碼解析成抽象語法樹(AST)4.
base64的編碼原理5.幾種進(jìn)制的相互轉(zhuǎn)換計算方法,在
JavaScript中如何表示和轉(zhuǎn)換
網(wǎng)絡(luò)協(xié)議
1.理解什么是協(xié)議,了解
TCP/IP網(wǎng)絡(luò)協(xié)議族的構(gòu)成,每層協(xié)議在應(yīng)用程序中發(fā)揮的作用2.三次握手和四次揮手詳細(xì)原理,為什么要使用這種機(jī)制
3.有哪些協(xié)議是可靠,
TCP有哪些手段保證可靠交付4.
DNS的作用、DNS解析的詳細(xì)過程,DNS優(yōu)化原理5.
CDN的作用和原理6.
HTTP請求報文和響應(yīng)報文的具體組成,能理解常見請求頭的含義,有幾種請求方式,區(qū)別是什么7.
HTTP所有狀態(tài)碼的具體含義,看到異常狀態(tài)碼能快速定位問題8.
HTTP1.1、HTTP2.0帶來的改變9.
HTTPS的加密原理,如何開啟HTTPS,如何劫持HTTPS請求10.理解
WebSocket協(xié)議的底層原理、與HTTP的區(qū)別
設(shè)計模式
1.熟練使用前端常用的設(shè)計模式編寫代碼,如單例模式、裝飾器模式、代理模式等
2.發(fā)布訂閱模式和觀察者模式的異同以及實際應(yīng)用
3.可以說出幾種設(shè)計模式在開發(fā)中的實際應(yīng)用,理解框架源碼中對設(shè)計模式的應(yīng)用
四、數(shù)據(jù)結(jié)構(gòu)和算法
據(jù)我了解的大部分前端對這部分知識有些欠缺,甚至抵觸,但是,如果突破更高的天花板,這部分知識是必不可少的,而且我親身經(jīng)歷——非常有用!
JavaScript編碼能力
1.多種方式實現(xiàn)數(shù)組去重、扁平化、對比優(yōu)缺點
2.多種方式實現(xiàn)深拷貝、對比優(yōu)缺點
3.手寫函數(shù)柯里化工具函數(shù)、并理解其應(yīng)用場景和優(yōu)勢
4.手寫防抖和節(jié)流工具函數(shù)、并理解其內(nèi)部原理和應(yīng)用場景
5.實現(xiàn)一個
sleep函數(shù)
手動實現(xiàn)前端輪子
1.手動實現(xiàn)
call、apply、bind2.手動實現(xiàn)符合
Promise/A+規(guī)范的Promise、手動實現(xiàn)async await3.手寫一個
EventEmitter實現(xiàn)事件發(fā)布、訂閱4.可以說出兩種實現(xiàn)雙向綁定的方案、可以手動實現(xiàn)
5.手寫
JSON.stringify、JSON.parse6.手寫一個模版引擎,并能解釋其中原理
7.手寫
懶加載、下拉刷新、上拉加載、預(yù)加載等效果
數(shù)據(jù)結(jié)構(gòu)
1.理解常見數(shù)據(jù)結(jié)構(gòu)的特點,以及他們在不同場景下使用的優(yōu)缺點
2.理解
數(shù)組、字符串的存儲原理,并熟練應(yīng)用他們解決問題3.理解
二叉樹、棧、隊列、哈希表的基本結(jié)構(gòu)和特點,并可以應(yīng)用它解決問題4.了解
圖、堆的基本結(jié)構(gòu)和使用場景
算法
1.可計算一個算法的時間復(fù)雜度和空間復(fù)雜度,可估計業(yè)務(wù)邏輯代碼的耗時和內(nèi)存消耗
2.至少理解五種排序算法的實現(xiàn)原理、應(yīng)用場景、優(yōu)缺點,可快速說出時間、空間復(fù)雜度
3.了解遞歸和循環(huán)的優(yōu)缺點、應(yīng)用場景、并可在開發(fā)中熟練應(yīng)用
4.可應(yīng)用
回溯算法、貪心算法、分治算法、動態(tài)規(guī)劃等解決復(fù)雜問題5.前端處理海量數(shù)據(jù)的算法方案
五、運行環(huán)境
我們需要理清語言和環(huán)境的關(guān)系:
ECMAScript描述了JavaScript語言的語法和基本對象規(guī)范
瀏覽器作為
JavaScript的一種運行環(huán)境,為它提供了:文檔對象模型(DOM),描述處理網(wǎng)頁內(nèi)容的方法和接口、瀏覽器對象模型(BOM),描述與瀏覽器進(jìn)行交互的方法和接口
Node也是
JavaScript的一種運行環(huán)境,為它提供了操作I/O、網(wǎng)絡(luò)等API
瀏覽器API
1.瀏覽器提供的符合
W3C標(biāo)準(zhǔn)的DOM操作API、瀏覽器差異、兼容性2.瀏覽器提供的瀏覽器對象模型 (
BOM)提供的所有全局API、瀏覽器差異、兼容性3.大量
DOM操作、海量數(shù)據(jù)的性能優(yōu)化(合并操作、Diff、requestAnimationFrame等)4.瀏覽器海量數(shù)據(jù)存儲、操作性能優(yōu)化
5.
DOM事件流的具體實現(xiàn)機(jī)制、不同瀏覽器的差異、事件代理6.前端發(fā)起網(wǎng)絡(luò)請求的幾種方式及其底層實現(xiàn)、可以手寫原生
ajax、fetch、可以熟練使用第三方庫7.瀏覽器的同源策略,如何避免同源策略,幾種方式的異同點以及如何選型
8.瀏覽器提供的幾種存儲機(jī)制、優(yōu)缺點、開發(fā)中正確的選擇
9.瀏覽器跨標(biāo)簽通信
瀏覽器原理
1.各瀏覽器使用的
JavaScript引擎以及它們的異同點、如何在代碼中進(jìn)行區(qū)分2.請求數(shù)據(jù)到請求結(jié)束與服務(wù)器進(jìn)行了幾次交互
3.可詳細(xì)描述瀏覽器從輸入
URL到頁面展現(xiàn)的詳細(xì)過程4.瀏覽器解析
HTML代碼的原理,以及構(gòu)建DOM樹的流程5.瀏覽器如何解析
CSS規(guī)則,并將其應(yīng)用到DOM樹上6.瀏覽器如何將解析好的帶有樣式的
DOM樹進(jìn)行繪制7.瀏覽器的運行機(jī)制,如何配置資源異步同步加載
8.瀏覽器回流與重繪的底層原理,引發(fā)原因,如何有效避免
9.瀏覽器的垃圾回收機(jī)制,如何避免內(nèi)存泄漏
10.瀏覽器采用的緩存方案,如何選擇和控制合適的緩存方案
Node
1.理解
Node在應(yīng)用程序中的作用,可以使用Node搭建前端運行環(huán)境、使用Node操作文件、操作數(shù)據(jù)庫等等2.掌握一種
Node開發(fā)框架,如Express,Express和Koa的區(qū)別3.熟練使用
Node提供的API如Path、Http、Child Process等并理解其實現(xiàn)原理4.
Node的底層運行原理、和瀏覽器的異同5.
Node事件驅(qū)動、非阻塞機(jī)制的實現(xiàn)原理
六、框架和類庫
輪子層出不窮,從原理上理解才是正道
TypeScript
1.理解
泛型、接口等面向?qū)ο蟮南嚓P(guān)概念,TypeScript對面向?qū)ο罄砟畹膶崿F(xiàn)2.理解使用
TypeScript的好處,掌握TypeScript基礎(chǔ)語法3.
TypeScript的規(guī)則檢測原理4.可以在
React、Vue等框架中使用TypeScript進(jìn)行開發(fā)
React
1.
React和vue選型和優(yōu)缺點、核心架構(gòu)的區(qū)別2.
React中setState的執(zhí)行機(jī)制,如何有效的管理狀態(tài)3.
React的事件底層實現(xiàn)機(jī)制4.
React的虛擬DOM和Diff算法的內(nèi)部實現(xiàn)5.
React的Fiber工作原理,解決了什么問題6.
React Router和Vue Router的底層實現(xiàn)原理、動態(tài)加載實現(xiàn)原理7.可熟練應(yīng)用
React API、生命周期等,可應(yīng)用HOC、render props、Hooks等高階用法解決問題8.基于
React的特性和原理,可以手動實現(xiàn)一個簡單的React
Vue
1.熟練使用
Vue的API、生命周期、鉤子函數(shù)2.
MVVM框架設(shè)計理念3.
Vue雙向綁定實現(xiàn)原理、Diff算法的內(nèi)部實現(xiàn)4.
Vue的事件機(jī)制5.從
template轉(zhuǎn)換成真實DOM的實現(xiàn)機(jī)制
多端開發(fā)
1.單頁面應(yīng)用(
SPA)的原理和優(yōu)缺點,掌握一種快速開發(fā)SPA的方案2.理解
Viewport、em、rem的原理和用法,分辨率、px、ppi、dpi、dp的區(qū)別和實際應(yīng)用3.移動端頁面適配解決方案、不同機(jī)型適配方案
4.掌握一種
JavaScript移動客戶端開發(fā)技術(shù),如React Native:可以搭建React Native開發(fā)環(huán)境,熟練進(jìn)行開發(fā),可理解React Native的運作原理,不同端適配5.掌握一種
JavaScriptPC客戶端開發(fā)技術(shù),如Electron:可搭建Electron開發(fā)環(huán)境,熟練進(jìn)行開發(fā),可理解Electron的運作原理6.掌握一種小程序開發(fā)框架或原生小程序開發(fā)
7.理解多端框架的內(nèi)部實現(xiàn)原理,至少了解一個多端框架的使用
數(shù)據(jù)流管理
1.掌握
React和Vue傳統(tǒng)的跨組件通信方案,對比采用數(shù)據(jù)流管理框架的異同2.熟練使用
Redux管理數(shù)據(jù)流,并理解其實現(xiàn)原理,中間件實現(xiàn)原理3.熟練使用
Mobx管理數(shù)據(jù)流,并理解其實現(xiàn)原理,相比Redux有什么優(yōu)勢4.熟練使用
Vuex管理數(shù)據(jù)流,并理解其實現(xiàn)原理5.以上數(shù)據(jù)流方案的異同和優(yōu)缺點,不情況下的技術(shù)選型
實用庫
1.至少掌握一種
UI組件框架,如antd design,理解其設(shè)計理念、底層實現(xiàn)2.掌握一種圖表繪制框架,如
Echart,理解其設(shè)計理念、底層實現(xiàn),可以自己實現(xiàn)圖表3.掌握一種
GIS開發(fā)框架,如百度地圖API4.掌握一種可視化開發(fā)框架,如
Three.js、D35.工具函數(shù)庫,如
lodash、underscore、moment等,理解使用的工具類或工具函數(shù)的具體實現(xiàn)原理
開發(fā)和調(diào)試
1.熟練使用各瀏覽器提供的調(diào)試工具
2.熟練使用一種代理工具實現(xiàn)請求代理、抓包,如
charls3.可以使用
Android、IOS模擬器進(jìn)行調(diào)試,并掌握一種真機(jī)調(diào)試方案4.了解
Vue、React等框架調(diào)試工具的使用
七、前端工程
前端工程化:以工程化方法和工具提高開發(fā)生產(chǎn)效率、降低維護(hù)難度
項目構(gòu)建
1.理解
npm、yarn依賴包管理的原理,兩者的區(qū)別2.可以使用
npm運行自定義腳本3.理解
Babel、ESLint、webpack等工具在項目中承擔(dān)的作用4.
ESLint規(guī)則檢測原理,常用的ESLint配置5.
Babel的核心原理,可以自己編寫一個Babel插件6.可以配置一種前端代碼兼容方案,如
Polyfill7.
Webpack的編譯原理、構(gòu)建流程、熱更新原理,chunk、bundle和module的區(qū)別和應(yīng)用8.可熟練配置已有的
loaders和plugins解決問題,可以自己編寫loaders和plugins
nginx
1.正向代理與反向代理的特點和實例
2.可手動搭建一個簡單的
nginx服務(wù)器、3.熟練應(yīng)用常用的
nginx內(nèi)置變量,掌握常用的匹配規(guī)則寫法4.可以用
nginx實現(xiàn)請求過濾、配置gzip、負(fù)載均衡等,并能解釋其內(nèi)部原理
開發(fā)提速
1.熟練掌握一種接口管理、接口
mock工具的使用,如yapi2.掌握一種高效的日志埋點方案,可快速使用日志查詢工具定位線上問題
3.理解
TDD與BDD模式,至少會使用一種前端單元測試框架
版本控制
1.理解
Git的核心原理、工作流程、和SVN的區(qū)別2.熟練使用常規(guī)的
Git命令、git rebase、git stash等進(jìn)階命令3.可以快速解決
線上分支回滾、線上分支錯誤合并等復(fù)雜問題
持續(xù)集成
1.理解
CI/CD技術(shù)的意義,至少熟練掌握一種CI/CD工具的使用,如Jenkins2.可以獨自完成架構(gòu)設(shè)計、技術(shù)選型、環(huán)境搭建、全流程開發(fā)、部署上線等一套完整的開發(fā)流程(包括
Web應(yīng)用、移動客戶端應(yīng)用、PC客戶端應(yīng)用、小程序、H5等等)
八、項目和業(yè)務(wù)
后端技能
1.了解后端的開發(fā)方式,在應(yīng)用程序中的作用,至少會使用一種后端語言
2.掌握數(shù)據(jù)最終在數(shù)據(jù)庫中是如何落地存儲的,能看懂表結(jié)構(gòu)設(shè)計、表之間的關(guān)聯(lián),至少會使用一種數(shù)據(jù)庫
性能優(yōu)化
1.了解前端性能衡量指標(biāo)、性能監(jiān)控要點,掌握一種前端性能監(jiān)控方案
2.了解常見的
Web、App性能優(yōu)化方案3.
SEO排名規(guī)則、SEO優(yōu)化方案、前后端分離的SEO4.
SSR實現(xiàn)方案、優(yōu)缺點、及其性能優(yōu)化5.
Webpack的性能優(yōu)化方案6.
Canvas性能優(yōu)化方案7.
React、Vue等框架使用性能優(yōu)化方案
前端安全
1.
XSS攻擊的原理、分類、具體案例,前端如何防御2.
CSRF攻擊的原理、具體案例,前端如何防御3.
HTTP劫持、頁面劫持的原理、防御措施
業(yè)務(wù)相關(guān)
1.能理解所開發(fā)項目的整體業(yè)務(wù)形態(tài)、業(yè)務(wù)目標(biāo)、業(yè)務(wù)架構(gòu),可以快速定位線上業(yè)務(wù)問題
2.能理解所開發(fā)項目整體的技術(shù)架構(gòu)、能快讀的根據(jù)新需求進(jìn)行開發(fā)規(guī)劃、能快速根據(jù)業(yè)務(wù)報警、線上日志等定位并解決線上技術(shù)問題
3.可以將自己的想法或新技術(shù)在業(yè)務(wù)中落地實踐,盡量在團(tuán)隊中擁有一定的不可替代性
九、學(xué)習(xí)提升
vczh大神在知乎問題【如何能以后達(dá)到溫趙輪三位大神的水平?】下的回答:
這十幾年我一共做了三件事:
- 1、不以賺錢為目的選擇學(xué)習(xí)的內(nèi)容;
- 2、以自己是否能造出輪子來衡量學(xué)習(xí)的效果;
- 3、堅持每天寫自己的代碼,前10年每天至少6個小時,不包含學(xué)習(xí)和工作的時間。
上面幾點可能有點難,第一點我就做不到,但是做到下面績點還是比較容易的。
關(guān)于寫博客說明下,能給別人講明白的知識會比自己學(xué)習(xí)掌握的要深刻許多
1.擁有自己的技術(shù)博客,或者在一些博客平臺上擁有自己的專欄
2.定期的將知識進(jìn)行總結(jié),不斷完善自己的知識體系
3.盡量將自己的知識轉(zhuǎn)換成真實的產(chǎn)出,不要僅僅停留在書面理解層面,更重要的是實際應(yīng)用
4.堅持輸出
自己的代碼,不要盲目的扎進(jìn)公司業(yè)
十、技術(shù)之外
這部分可能比上面九條加起來重要!
1.了解互聯(lián)網(wǎng)人員術(shù)語:
CEO、CTO、COO、CFO、PM、QA、UI、FE、DEV、DBA、OPS等2.了解互聯(lián)網(wǎng)行業(yè)術(shù)語:
B2B、B2C、C2C、O2O等3.掌握互聯(lián)網(wǎng)行業(yè)溝通、問答、學(xué)習(xí)的
4.有一定的
"PPT"能力5.有一定的理財意識,至少了解儲蓄、貨幣基金、保險、指數(shù)基金、股票等基本的理財知識
6.掌握在繁重的工作和長期的電腦輻射的情況下保持健康的方法,建立正確的養(yǎng)生知識體系
十一、資源推薦
有了知識體系,在閱讀一篇技術(shù)文章的時候就很容易把它歸類,我一直以來就是這樣做的。
事實證明,在閱讀文章或書籍時,有目的和歸類的閱讀比"隨便看看"后的只是留存率要高很多。
每閱讀到一篇好的文章或者書籍,我都會收藏并歸類到我的知識體系中。
下面是一些我覺得還不錯的文章、博客或者書籍教程等等,分享給大家,資源不多,但都是精品。
學(xué)習(xí)一門知識,最好先閱讀官方文檔,把所有的API大概瀏覽一遍,再繼續(xù)看大佬們總結(jié)的進(jìn)階知識,什么東西是搬運過來的,什么是干貨,一目了然。
語言基礎(chǔ)
[??]
JavaScript高級程序設(shè)計(必看):book.douban.com/subject/105…[??]高性能
JavaScript:book.douban.com/subject/536…現(xiàn)代
JavaScript教程:zh.javascript.info/阮一峰的
ECMAScript 6教程:es6.ruanyifeng.com/ECMAScript 6標(biāo)準(zhǔn):www.ecma-international.org/ecma-262/6.…HTML meta標(biāo)簽總結(jié)與屬性使用介紹:segmentfault.com/a/119000000…CSS編碼指導(dǎo):github.com/chadluo/CSS…
計算機(jī)基礎(chǔ)
大前端開發(fā)者需要了解的基礎(chǔ)編譯原理和語言知識:fullstack.blog/2017/06/24/…
圖解
HTTP:book.douban.com/subject/258…[??]
JavaScript設(shè)計模式與開發(fā)實踐:book.douban.com/subject/263…正則表達(dá)式30分鐘入門教程:link.juejin.im/?target=htt…
數(shù)據(jù)結(jié)構(gòu)和算法
數(shù)據(jù)結(jié)構(gòu)與算法之美:time.geekbang.org/column/intr…
用動畫的形式呈現(xiàn)解
LeetCode題目的思路:github.com/MisterBooo/…JavaScript數(shù)據(jù)結(jié)構(gòu)和算法:github.com/ConardLi/aw…30-seconds-of-code(里面有很多js代碼非常巧妙,我正在將它翻譯成中文):github.com/ConardLi/30…
運行環(huán)境
《重學(xué)前端》中的瀏覽器原理章節(jié):time.geekbang.org/column/arti…
圖解瀏覽器的基本工作原理:zhuanlan.zhihu.com/p/47407398
七天學(xué)會
NodeJS:github.com/nqdeng/7-da…Node.js模塊加載與運行原理:efe.baidu.com/blog/nodejs…
框架和類庫
TypeScript Handbook:zhongsp.gitbooks.io/typescript-…React.js小書:huziketang.mangojuice.top/books/react…React深入系列:juejin.im/post/5cad39…Webpack React小書:fakefish.github.io/react-webpa…Vue.js技術(shù)揭秘:github.com/ustbhuangyi…Vuex-在Vue中管理狀態(tài):sabe.io/tutorials/g…你需要
Mobx還是Redux?:juejin.im/post/5a7fd7…Underscore源碼分析:yoyoyohamapi.gitbooks.io/undersercor…微信小程序開發(fā)資源匯總:github.com/justjavac/a…
騰訊移動
Web前端知識庫:github.com/AlloyTeam/M…
前端工程
一口(很長的)氣了解
babel:zhuanlan.zhihu.com/p/43249121Webpack傻瓜式指南:zhuanlan.zhihu.com/p/20367175Webpack原理:segmentfault.com/a/119000001…廖雪峰的
git教程:www.liaoxuefeng.com/wiki/001373…前端開發(fā)者必備的
Nginx知識:juejin.im/post/5c85a6…使用Jenkins進(jìn)行持續(xù)集成:www.liaoxuefeng.com/article/001…
項目和業(yè)務(wù)
常見六大
Web安全攻防解析:github.com/ljianshu/Bl…深入理解前端性能監(jiān)控:juejin.im/post/5caaac…
[??]高性能網(wǎng)站建設(shè)指南:book.douban.com/subject/313…
新人如何快速融入技術(shù)實力強(qiáng)的前端團(tuán)隊:juejin.im/post/5cb860…
學(xué)習(xí)提升
印記中文(各種中文開發(fā)文檔):www.docschina.org/
前端學(xué)習(xí)方法:github.com/helloqingfe…
如何在工作內(nèi)外獲得持續(xù)的技術(shù)成長:juejin.im/post/5cbd74…
優(yōu)秀的前端博客匯總:github.com/foru17/fron…
另外推薦我一直在關(guān)注的幾位大佬的個人博客:
冴羽的博客:github.com/mqyqingfeng…
左耳朵耗子:coolshell.cn/
技術(shù)之外
互聯(lián)網(wǎng)術(shù)語大全:www.itdecent.cn/p/9a7ca206c…
互聯(lián)網(wǎng)溝通、問答、學(xué)習(xí)的藝術(shù):zhuanlan.zhihu.com/p/41431775
經(jīng)常加班至深夜,怎樣才能保持身體健康:www.zhihu.com/question/21…
其實在這個信息發(fā)達(dá)的時代最不缺的就是資源,如何從眾多的資源中獲取到真正精華的部分,是非常重要的,資源在于精不在于多,強(qiáng)烈建議在保證深度的情況下再保證廣度。
小結(jié)
希望你閱讀本篇文章后可以達(dá)到以下幾點:
從知識清單中找到自己的知識盲點與欠缺
具有知識體系化的思想,開始建立自己的知識體系
閱讀文章時將知識歸類到知識體系中,并不斷完善自己的知識體系
從文章中獲取到了有用的資源
文中如有錯誤,歡迎在評論區(qū)指正,如果這篇文章幫助到了你,歡迎點贊和關(guān)注。
如果你有什么好的知識、資源推薦,歡迎在評論區(qū)留言。
作者:ConardLi
鏈接:https://juejin.im/post/5cc1da82f265da036023b628
求點贊,求關(guān)注~
