前端入門資源分享

本文已使用維權(quán)騎士進(jìn)行維權(quán),轉(zhuǎn)載請私,維權(quán)必究!

  • 最近有收到很多私信,希望分享一些前端學(xué)習(xí)經(jīng)驗(yàn)。個人雖然在秋招時收割了一大批大廠offer,但是技術(shù)路慢慢,吾將上下而求索,這里給大家分享一些個人前端學(xué)習(xí)用到的一些資源,看者取其精華去其糟粕即可。本文會一直持續(xù)更新。
  • 本文藍(lán)色字體是對應(yīng)軟件或知識鏈接,鏈接都指向相應(yīng)的官網(wǎng)或一些很精華的知識分享網(wǎng)址,盡可能鏈接到大家可訪問的國內(nèi)鏡像或中文版,絕對無廣告鏈接。
  • 更多資源建議在歡迎評論區(qū)討論

我是目錄

  1. 編輯器與瀏覽器
    1.1 編輯器
    1.2 瀏覽器
  2. 高能鏈接
    2.1 學(xué)習(xí)網(wǎng)址
    2.2 三大前端框架
    2.3 常用JS與Node庫
    2.4 UI庫
    2.5 潮流前端
    2.6 工具
    2.7 社區(qū)
    2.8 學(xué)習(xí)網(wǎng)站
    2.9 博客 and 文章
  3. 學(xué)習(xí)書籍

1. 編輯器與瀏覽器

1.1 編輯器

VSCode(也可以用SublimeWebstore) - 個人使用的VC,因?yàn)殚_源的VC有很多開源的插件,這款插件豐富的編輯器簡直就是為前端工程師們量身定制,據(jù)說它本身就是一款借助前端庫electronjs構(gòu)建的桌面應(yīng)用。

1.2 瀏覽器

Chrome瀏覽器 - 調(diào)試前端代碼的神器,Chrome的開發(fā)人員控制臺(按F12召喚),可以調(diào)試布局,可以console查看bug和打斷點(diǎn),可以查看網(wǎng)絡(luò)資源和網(wǎng)絡(luò)加載,可以查看渲染機(jī)制,還可以查看緩存等,非常之強(qiáng)大。對于它的變態(tài)V8引擎感興趣的同學(xué)可以了解下。

2. 高能鏈接

前方一大波高能到來!??!

2.1 學(xué)習(xí)網(wǎng)址

W3School - 一個H5+CSS3基礎(chǔ)入門非常好的網(wǎng)站,網(wǎng)站里還有很好的JS基礎(chǔ)教程、PHP教程、網(wǎng)絡(luò)教程,公認(rèn)的入門必備網(wǎng)站。

MDN - 火狐打造的最全的前端百科詞典,所有前端最新規(guī)范都收錄在其中,而且還支持中文版喲,就這一個網(wǎng)站可以助你從入門到精通啦~

阮一峰老師的ES6入門 - 阮老師的開源入門ES6的文檔可以說是非常良心的巨作,整本書對于入門ES6非常友好,所有ES6要點(diǎn)知識都囊括其中。

廖雪峰老師的JS入門 - 雪峰老師的JS入門教程寫的很用心,雖然更深的知識還需要自己去MDN或買一本《JS高程》,但是快速入門JS是非常高效的。

nodeJs - 所有NodeJs的API都在這里啦,看完它,你的NodeJs進(jìn)軍中級甚至高級都沒問題啦。

2.2 三大前端框架

Angular - 三大主流前端框架之一,國外很火的一個老大哥前端框架。

react全家桶 - 這款站在前端食物鏈頂端的框架,擁有龐大的生態(tài)圈,無論是PC端、移動端還是native開發(fā),全盤通吃,各大大廠也都在使用這個框架。
react,react-router,reduxreact-native

vue全家桶 - 由國內(nèi)尤大神主力打造的MVVM前端框架,簡單易上手,大廠很多PC業(yè)務(wù)都基于此框架。
vue,vuex,vue-router

2.3 常用JS與Node庫

JQ - 不多說,JS的簡化版與速成版,但是建議不要以為會用JQ就會前端了,還有很長很長的路要走,要想成為一個前端大佬還需要對JS有較深的涉獵才行。

Zepto - 移動端版的JQ。

Babel - 一個 JavaScript 編譯器,一般用于轉(zhuǎn)碼編譯ES6、JSX較多。

Underscore - 輕量精干的JS庫,它提供了幾十種函數(shù)式編程的方法,彌補(bǔ)了JQ庫的不足。

Backbone - 一個輕量級MVC框架,重度依賴Underscore.js,依托它我們可以像高級語言一樣定義類、類屬性及方法,更好的組織代碼并按框架提供的數(shù)據(jù)邏輯分離方法減少代碼混亂。

Handbar - 可以說它是一種很好的前后端分離的方案, 是 JavaScript的一個語義模板庫,通過對view和data的分離來快速構(gòu)建Web模板。

Express - NodeJs的老將軍框架了,簡化封裝了NodeJs的API,提供了很多常用的Node服務(wù)。

Koa2 - NodeJs的小生將軍,由 Express 幕后的原班人馬打造,一個超輕量級的NodeJs框架。

2.4 UI庫

bootstrap - 用于開發(fā)響應(yīng)式布局、移動設(shè)備優(yōu)先的前端UI庫。

elementUI - 餓了么開發(fā)的一款前端UI庫,簡單易上手,搭配vue使用更好。

antDesign - 螞蟻金服開發(fā)的一款前端UI庫,成熟的UI體系和高性能,搭配React使用更好。

2.5 潮流前端

less - 賦予CSS動態(tài)語言的特性。
sass - 成熟、穩(wěn)定、強(qiáng)大的 CSS 擴(kuò)展語言解析器。

PWA - (若此鏈接打不開,請掛代理或打開下面這個)

PWA實(shí)戰(zhàn) - 作為一個前端開發(fā)者,如果你還不知道PWA是什么那么你就真的是OUT了。PWA,面向下一代的Progressive Web APP。

Weex - 一個使用 Web 開發(fā)體驗(yàn)來開發(fā)高性能原生應(yīng)用的移動端框架,非常適合搭配Vue使用。

Rax - 我廠構(gòu)建的一個跨容器的渲染引擎,底層依舊是Native,非常適合搭配React使用。

TypeScript - TS可以說是這兩年非?;馃岬哪_本語言了,可以把它當(dāng)作JavaScript的超集。它支持任意瀏覽器,任意環(huán)境,任意系統(tǒng)并且也是開源的。

2.6 工具

Git - github,最大的開源平臺,程序員的天堂世界,學(xué)會掌控它吧。

Webpack - 當(dāng)前最火的前端打包工具。

Gulp - 最輕量級別的前端構(gòu)建工具。

Grunt - 自動化的強(qiáng)生態(tài)前端構(gòu)建工具。

hexo - 聽說你們搭建博客都用它。

IconFont - 我廠的一個開源Icon庫,聽說你們的Icon都來自于它。

cocos2d-x - 一個做游戲的引擎。

2.7 社區(qū)

CSDN - 國內(nèi)最大的IT技術(shù)交流論壇,有很多厲害的技術(shù)博客都出自于此。

思否 - 前端學(xué)習(xí)論壇。

掘金 - 前端學(xué)習(xí)論壇。

伯樂在線 - 前端學(xué)習(xí)論壇。

W3cplus - W3C的前端技術(shù)交流論壇。

gitter - 前端技術(shù)交流gitter,有點(diǎn)類似QQ群,大家都在其中交流前端技術(shù)。

知乎 - 知乎上的前端交流有很多非常精細(xì)、獨(dú)到的前端技術(shù)見解,很是值得學(xué)習(xí)。

大前端 - 一個純前端技術(shù)交流社區(qū)。

2.8 學(xué)習(xí)網(wǎng)站

慕課網(wǎng) - 課程學(xué)習(xí)網(wǎng)站。

網(wǎng)易云課堂 - 課程學(xué)習(xí)網(wǎng)站。

FreeCodeCamp - 從0基礎(chǔ)一步一步成長的編碼學(xué)習(xí)網(wǎng)站,非常建議用它學(xué)習(xí)前端。

PS:不想提菜鳥,你們都知道,老,舊,知識不全。

2.9 博客 and 文章

以下鏈接均來自于個人收藏,若覺得有廣告嫌疑請略過

阮一峰 - 阮大神的官方博客,有很多精彩的個人文章和技術(shù)文章,值得一去。

廖雪峰 - 雪峰老師的博客是一個純技術(shù)博客,其中Js,Git,Python都是免費(fèi)而又適用的好東西呀。

技術(shù)胖 - 勝洪宇老師博客很多視頻都是免費(fèi)的,每節(jié)課都很短暫而又精妙,很適合入門和初級前端同學(xué)學(xué)習(xí)。

Jake - 一個個人認(rèn)為有很多精彩的前端好文的技術(shù)博客。

3. 學(xué)習(xí)書籍

《JavaScript高級程序設(shè)計(jì)》 作者:Nicholas- 書不在多,在于精。沒錯,這就是我們前端工程師常說的“紅寶石”書籍。這一本書是我個人唯一推薦最好買一本的,因?yàn)樗腏S講得實(shí)在是太好了,每一遍都會有不同的收獲。

《ES6標(biāo)準(zhǔn)入門》作者:阮一峰 - 阮老師的這本ES6寶典可以說是對于入門ES6非常平滑而又舒暢,當(dāng)然,上面也有開源的電子書官網(wǎng)。

《鋒利的Jquery》作者:單東林 - 一本三天就入門JQ的書籍,雖然個人并不推薦大家現(xiàn)在去學(xué)習(xí)JQ了,畢竟現(xiàn)在前端更多的是模塊化和組件化開發(fā),但是對于快速開發(fā)批量網(wǎng)頁,使用JQ還是很快的,只是后期維護(hù)比較麻煩,尤其是大型項(xiàng)目。

《JavaScript權(quán)威指南》作者:費(fèi)拉納提 - 一本JS字典,講完了所有JS知識。

《HTTP權(quán)威指南》作者:David Gourley - 非前端書籍!作為前端工程師,我們做的很多工作除了頁面渲染就是性能加載,所以網(wǎng)絡(luò)相關(guān)的知識,包括代理、網(wǎng)關(guān)、隧道,尤其是緩存,都至少要懂一些。

《大型網(wǎng)站技術(shù)架構(gòu)》作者:李智慧 - 非前端書籍!為什么會推薦一本架構(gòu)書籍呢,因?yàn)樽x完這本書,只會前端的你就可以站在整個技術(shù)設(shè)計(jì)角度去構(gòu)思,為什么當(dāng)下會把程序員區(qū)分為前端、后端、安卓、IOS、數(shù)據(jù)、算法、網(wǎng)絡(luò)、測試等不同職位了。

《算法導(dǎo)論》作者:Thomas H.Cormen - 非前端書籍!程序員兩大圣經(jīng)之一,算法祖師級別的書籍,其中講到的數(shù)據(jù)結(jié)構(gòu)和算法邏輯對于前端編程都很有用處,當(dāng)然對于將來入門后臺也很有用的啦。

《深入理解計(jì)算機(jī)系統(tǒng)》作者:蘭德爾 - 非前端書籍!程序員兩大圣經(jīng)之一,系統(tǒng)祖師級別的書籍,這本書跟前端的關(guān)系不那么緊密,對于系統(tǒng)知識,前端只需要了解下瀏覽器進(jìn)程線程包括GPU、CPU就OK啦,但是作為程序員,尤其是作為大前端一員將來進(jìn)軍后端,那么閱讀這本書就非常有必要啦。

還是那句話,書不在多,在精。


以上,歡迎大家在評論區(qū)進(jìn)行補(bǔ)充,如果覺得對你有用,順手點(diǎn)個贊收個藏加個關(guān)注唄,謝謝啦~

點(diǎn)贊

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容