1. 程式人生 > >前端工作學習相關網站收集整理

前端工作學習相關網站收集整理

 

如果部分國外網站訪問不了的,請自行解決。

 

開發工具

 

平時工作開發時用到的一些輔助工具類網站

網址

說明

regexr.com

正則表示式驗證匹配

www.gitignore.io

根據選擇生成.gitignore檔案

unbug.github.io/codelf

變數命名推薦(支援中文)

www.html.cn/tool/css3Pr…

css box-shadow陰影預覽及程式碼生成

www.internetke.com/jsEffects/2…

css漸變預覽及程式碼生成

xuanfengge.com/easeing/cea…

css動畫緩動函式預覽及生成

www.toptal.com/developers/…

多張圖片合成雪碧圖,並生成對應css

tool.lu

眾多工具集合,包括時間戳轉換,進位制轉換等

www.bootcdn.cn 或 cdn.baomitu.com

國內的CDN庫,速度快

www.jsdelivr.com

國外的cdn庫,支援github,npm,WordPress

線上編輯

 

程式碼線上編輯執行

網址

說明

jsrun.net

國內網站,有程式碼提示,支援cdn庫匯入,不支援建立專案,有程式碼示例市場。

jsbin.com

國外網站,功能少,支援本地搭建

codepen.io

國外網站,支援cdn庫匯入,支援建立專案(非會員只支援一個專案),有大量豐富的程式碼示例市場。

stackblitz.com

國外網站,有程式碼提示,支援npm,可以建立專案(預設建立型別沒有vue)。

codesandbox.io

國外網站,支援npm和cdn庫匯入,可以建立各種型別專案

程式設計題庫

 

通過刷題和程式設計訓練來提升程式設計思想

視訊教程

 

技術分享和教程視訊。

網址

說明

Frontendmasters

有很多大佬的課程,英語課程,英文字幕,少部分課程免費,大部分需要訂閱會員,費用較貴,可以等黑五打折時買年費。

Egghead

英語課程,英文字幕。

IT大咖說

國內技術大會分享錄影為主。

慕課

國內網站,免費課挺多,實戰課付費,按課付費,價格偏貴。(其他如騰訊課堂,網易雲課堂等都差不多一個路數)

Udemy

網站有中文語言和中文課程,大部分英文課程也有中文字幕,按課收費,打折中的付費課程還算能接受。

可能看視訊更加清楚直觀,所以很多人都更喜歡看視訊,尤其是剛入門的時候。網上現在也有很多培訓機構的課程視訊,能找到了也可以看一看,但是進階時建議多看些國外視訊,拓寬下視野,順便練下英語能力。

 

上面大部分網站的視訊還是付費的,如果想看免費的視訊其實可以看youtube,上面技術分享的視訊也非常多,重點是都是免費的。

 

下面推薦幾個youtube的技術賬號,可以關注一下。

這只是我關注的一部分,還有非常多,大家可以自行探索。

 

文章資訊部落格

 

學習技術,瞭解行業最新動態。

 

國內

國外

建議申請一個專門用來接收訂閱郵件的郵箱,因為會接收到大量郵件

 

問答論壇

 

開發中遇到問題,去這些地方就對了。

網站

說明

知乎

沒什麼說的,有了知乎應該沒有人會再去用百度知道那垃圾東西了吧。

Segmentfault

更專注技術問題。

Stack Overflow

Segmentfault的外國原版,非常強大。

cnodejs

node社群

cnodejs

react社群

V2EX

程式設計師的1024?

開源框架和庫的問題,去github上找到專案查詢issue通常都能找到解決方案。

 

github相關

 

畢竟全球最大同性交友平臺,上面牛逼的人和專案非常至多,除了輪子也有很多教程,這裡推薦一些對前端學習有幫助的專案。

專案名

說明

30-seconds-of-code

短小精悍的工具函式,有中文版。

Front-end-Developer-Interview-Questions

前端面試題整理,有中文版,沒答案。

front-end-interview-handbook

前端面試手冊,有中文版,帶答案。

Front-End-Checklist

前端開發清單

javascript-algorithms

js演算法和資料結構

33-js-concepts

前端開發需要掌握的33個概念,有中文版。

awesome-javascript

javascript資源列表,有中文版。

nodebestpractices

node最佳實踐列表,有中文版。

在github上,awesome-*相似名稱可以找到其他類似專案,比如node資源列表awesome-node,react資源列表awesome-react。

 

 

來源 https://github.com/hoc2019/blog