前言

看到很多小夥伴都把自己好用好玩的站點分享出來了,我也是一個收集工具站點的愛好者。
由於有一些比較常見的網站,很多人已經分享過了,下面都是我從收藏夾中幾百個網站裏篩選出的一些非常不錯的網站,個人認為這些對前端的小夥伴來説是非常有幫助的, 這20+站點希望可以在你前進的道路上有所幫助!

原創不易!點贊鼓勵~🧡

freeCodeCamp

一直霸佔着 gitHub 排名 No.1 的項目,足足有 329k 個 star!!! 我天~啥時候我開源項目能有它的零頭 star~

有足足 500 多種教程,碼住,自學妥妥的!
詳情請戳 →:freeCodeCamp

JavaScript 週刊

每個禮拜都會向你發送最新的 JavaScript 文章、新聞和酷項目的時事通訊,在網頁中通過填寫郵箱訂閲,從此再也不怕掉隊了~
有了它你就能實時瞭解到 JavaScript 最新的資訊以及最新的基本動向!
目前已經有 177401 訂閲者 出到了 554 期
詳情請戳 →:JavaScript 週刊

JavaScript Tips

超多的 JavaScript 小技巧,我天~吃飯睡覺乘車上廁所的時間隨便看兩個,你的技術就會噌噌噌的上漲!
當然也可以提交你的小技巧到站點,非常有意思~
詳情請戳 →:JavaScript Tips

JavaScript 一行代碼

你的代碼夠簡潔嘛?想知道更多的代碼簡潔技巧嘛?快看這裏!

目前已經收集了 286 個 JavaScript 一行代碼,助你寫出更勁道的 JavaScript 代碼!

詳情請戳 →:JavaScript 一行代碼

30SecondsOfCode

目前已經彙總了大量的簡短代碼,我們平時閒暇的時候,可以學學它裏面的一些例子,這也是一個非常好的站點!

30 秒 JavaScript 代碼滿足你所有開發需求的簡短代碼片段 !

詳情請戳 →:30SecondsOfCode

GRID GARDEN

總共 28 關,以遊戲的方式,帶你學習 grid 佈局,非常的輕鬆,再也不用枯燥的死記硬背了~
非常好的是它是支持中文的,遊戲的關卡也非常的簡單,通俗易懂,通過娛樂的方式學習,是我最喜歡的了!

詳情請戳 →:GRID GARDEN

mojs

用簡單的幾行 js 代碼就能寫出非常酷炫的動畫效果!
也是開發中的一個非常有意思的利器!
詳情請戳 →:mojs

CodePen

海量的好玩的作品,可以下載非常多的小工具來輔助開發~支持在線編輯,趕快也上傳你的作品吧~

詳情請戳 →:CodePen

color Hunt

作為前端程序員,不知道如何配色?

不要怕,這裏有最好的顏色搭配,供你選擇!
color Hunt 作為設計師和藝術家的調色板,快去探索最新精選的調色方案吧~

詳情請戳 →:color Hunt

無損放大圖片

我們都知道,對圖片的放大是一定會出現失真的問題,那麼怎麼才能無損的對圖片進行放大呢?
這位日本小哥,基於深度學習,完成了這項功能

詳情請戳 →:無損放大圖片

w3c 規範檢測

檢查層疊樣式表(CSS)文檔和 HTML 或者 XHTML 文檔中的 CSS 內容

可以通過輸入你的站點,或者上傳你的相關文件,來檢測你的代碼是否嚴格符合 w3c 的標準規範.

詳情請戳 →:w3c 規範檢測

互聯網檔案館

比如你想看五六年前的 Google,百度,看去年的掘金,前年的 bilibili 等等站點的頁面構成和樣式...

完全可以在這裏找到

詳情請戳 →:互聯網檔案館

sketchToy

一款超級超級超級超級好用的免費的在線繪圖應用程序，可讓您與朋友分享您的工作的逐步回放。無需註冊。
它最大的亮點就是它能分享給你的好友,並逐步的回放你的繪畫過程!是一個非常有意思的工具.
詳情請戳 →:sketchToy

AirDroid

AirDroid 是一個快速、免費的應用，以無線方式通過網頁瀏覽器管理您的設備。
就是可以通過 web 端的網頁來鏈接並管理你的或者他人的手機.

詳情請戳 →:AirDroid

img2css

這是一個可以將任何圖像轉換為純 css 圖像的工具。
是 CSS 哦,不是 Base64,底層的具體實現應該比較複雜,是一個挺有意思的站點
詳情請戳 →:img2css

WallHaven

目前我認為最好的一個圖片素材網站,不管是用來做壁紙還是做站點資源圖片都是非常不錯的!

詳情請戳 →:WallHaven

ih5

目前很火的低代碼,這個平台是零代碼ih5,通過拖拉拽,生成你想要的 h5 頁面,還能製作遊戲和全景 3D 海報,簡直不要太帥~

詳情請戳 →:ih5

模板王

海量的成品商用站點模板,做博客,做官網...都可以用~免費下載它們的源碼!
非常良心的一個網站!

詳情請戳 →:模板王

Figma

web 端的 UI 設計工具,主要是因為它免費

詳情請戳 →:Figma

flagCounter

簡單的將它生成的代碼嵌入到你的站點,就能記錄下訪問你站點的所有訪客都來自哪些國家~
詳情請戳 →:flagCounter

最後

我是榮頂，很高興能在這裏和你一起變強！和我一起面向快樂編程！ 😉
關注我的公眾號 前埔寨，獲取更多好玩與有趣的前端知識。如果你也一樣對技術熱愛並且為之着迷,歡迎加我個人微信（ChicSparrow），我將會拉你入羣一起交流學習~ 🦄