[實用技巧]推薦一些很是棒的前端網站

有時候，提升效率的辦法，好比收藏一些好用的網站。這麼多年下來，收藏夾裏面躺着一些好用的網站，來掘金的時候，收穫了不少知識，這時候準備回饋點東西給大家。css

❝
若是部分國外網站訪問不了的，請自行解決。html
❞

平時學習前端時用到的一些輔助工具類網站前端

網址	說明
www.typora.io	我的最喜歡的Markdown寫做工具，所見即所得。
mdnice.com	使markdown語法更加美觀。
unbug.github.io/codelf	變量命名推薦（支持中文）。
www.docschina.org	印記中文。
github.com/any86/any-r…	正則表達式庫，很是全，使用起來很方便。
xuanfengge.com/easeing/cea…	css動畫緩動函數預覽及生成。
www.toptal.com/developers	多張圖片合成雪碧圖，並生成對應css。
tool.lu	整合經常使用的工具，包括正則表達式，進制轉換等。
www.bootcdn.cn 或 cdn.baomitu.com	國內的CDN庫，速度快。
www.gitignore.io	根據選擇會去生成.gitignore文件。

使用起來很方便，若是你使用Vscode開發的話，去插件商店搜索any-rule，很是便利。node

unbug.github.io/codelf 還在爲命名而煩惱嗎？它就能幫你解決，變量推薦的網站。react

好比多張圖片生成雪碧圖，還有國內的CDN庫，趕忙去試一試吧。git

常見的CSS動畫庫，炫酷的組件，各類好看UI組件，各類樣式及動畫在線生成。github

網站	說明
htmlarrows	提供HMTL的特殊符號，只有你想不到的
cssdeck	在線CSS前端代碼Demo樣式效果
codepen	前端炫酷樣式效果，各類loading效果，在線編程，Vue組件也特別多
Animista	前端炫酷樣式技能效果,各類各樣的動畫效果，提供在線的CSS代碼
cubic-bezier	CSS3貝塞爾曲線在線調試工具
three.js	JavaScript編輯3D模型，各類各樣炫酷的效果以及Documentation值得你去了解
View UI	一套基於 Vue.js 的高質量 UI 組件庫
Snapsvg	SVG動效的JS庫,各類炫酷的效果。
Cool Backgrounds	超酷的背景圖片，漸變的色彩的圖片背景都有，看起來很酷。

上面的網站，咱們就選兩個介紹一下。web

「codepen」正則表達式

一個在線編程的網站，不止如此，還能給你提供很是豐富的組件，炫酷的動畫也會給你思想上很大的衝擊力。

有時候，你想要的Vue組件上面說不定都有，好比你須要好看的loading UI的話，codepen都能給你必定的幫助。

「Animista」

咱們直接看看這個網站能夠減小咱們哪些工做量吧。

有時候，你須要一個炫酷的入場動畫，或者是炫酷的出場動畫，這個網站就能夠幫助你，直接給你生成相應的代碼，減小了你的工做量。

經過刷題和編程訓練來提高編程思想

對於非Acmer而言，經過這個兩個網站刷題來提升編程思想就好啦

「劍指offer」

咱們拿這個劍指offer來講，裏面的題目質量都是很高的，經過此網站的刷題，會讓你的編程思想更有所提升，也幫助你早日拿大廠Offer🚀

上面的分類會有相應的題目練習，經過分類標籤刷題，這樣子效率會更高些。

檢測Web前端兼容性或者是網站性能測試

「Can I Use」

很是好用的網站，有時候，你不知道一個屬性的兼容性，一查便知🚀

「PageSpeed」

這個網站能夠幫你檢測性能，給你提出一些優化建議，對於有我的博客的掘金小夥伴來講，很不錯。

至於其餘的網站，自行去探索一下。

技術分享和教程視頻。

網址	說明
free-programming-books	這個就很少說了，強烈推薦過的，免費的計算機編程類書籍，不少很全，不過都是英文的，有英語閱讀習慣的人強烈推薦給大家。
可汗學院	可汗學院是一種新型的教育方式，甚至顛覆了美國的教育方式，簡單地說，就是世界上最牛的老師，給全世界想學習的人，創造的一個百科全書式的、全免費和網上智能跟蹤的視頻學習平臺
IT大咖說	國內技術大會分享錄像爲主。
慕課	國內網站，免費課挺多，實戰課付費，按課付費，價格偏貴。（其餘如騰訊課堂，網易雲課堂等都差很少一個路數）
Udacity	Udacity 中文名叫作「優達學城」，是一個免費的自學編程的網站，不過目前也有一些收費課程。

固然了，這裏有中文版的，地址：free-programming-books-zh_CN.

GitHub上面154k,中文版的也有68k+,很是好的學習資源。

有些人喜歡看視頻，以爲這樣子更加清楚直觀，因此不少人都更喜歡看視頻，尤爲是剛入門的時候。網上如今也有不少培訓機構的課程視頻，能找到了也能夠看一看，可是進階時建議多看些國外視頻，拓寬下視野，順便練下英語能力。

上面大部分網站的視頻仍是付費的，若是想看免費的視頻其實能夠看youtube，上面技術分享的視頻也很是多，重點是都是免費的。

下面推薦幾個youtube的技術帳號，能夠關注一下。

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

網站	說明
知乎	沒什麼說的，有了知乎應該沒有人會再去用百度知道那垃圾東西了吧。
Segmentfault	更專一技術問題。
Stack Overflow	Segmentfault的外國原版，很是強大。
cnodejs	node社區
react-china	react社區
掘金	掘金是一個高質量產出的地方，固然了，不少的問題在這裏也是能夠尋求幫助並解決的。