前端特效
-不私藏！10 個前端特效教學的 YT 頻道分享
this.web
做前端動畫特效是我踏入這個領域最主要原因，也是我覺得網頁設計中最吸引人的一環
我整理了我認為 10 個超讚的 YouTube 頻道，適合各個階段的學習者，從 CSS 動畫、GSAP，到 P5.js、Three.js 3D 特效都有！👇
網頁基礎練習＆排版
一、Online Tutorials
頻道連結：Online Tutorials
這個頻道蠻適合初學者學習 CSS，內容非常廣，從簡單的 CSS 組件動畫到 Landing Page 排版以及更進階的 CSS、JS、Canvas 特效都有。
影片沒有任何對話，只有一行一行帶著你打出程式碼，所以英文不好也沒問題！當初覺得這個頻道真的是寶藏一直不想分享出來 😂
二、Bedimcode
頻道連結：Bedimcode
Bedimcode 更專注於網頁 UI 和 RWD 設計，有各式各樣的 Landing Page 可以觀摩練習，有些教學也有包含 GSAP 的應用，適合有點 CSS 底子想大量練習排版的人！
三、Optimistic Web - YouTube
頻道連結：Optimistic Web
這個頻道更多在講解 CSS 各種屬性的應用，也會有實際的例子，和前面兩個頻道不同，作者會講解和示範這些屬性，想要更深入了解 CSS 或練英聽的話，這個頻道就很適合你～
學習前端一直卡關很焦慮嗎？
免費領取
前端學習管理模板
這個模板能幫助你：
1. 規劃明確轉職目標與學習地圖
2. 一鍵生成學習路徑
3. 按主題建立學習筆記
4. 視覺化追蹤學習進度
🎉 領取成功！模板已經送出，記得檢查你的「促銷郵件」、「垃圾郵件」和「所有郵件」哦！
網頁進階特效
四、Codegrid
頻道連結：Codegrid
這個頻道有更多更進階的網頁動畫，大多數都會用 GSAP 來製作，如果你對網頁動畫有興趣，我也非常推薦這個頻道，裡面有很多不容易想到的 GSAP 應用，也是我當初學習 GSAP 時最愛的 YT！
五、Hyperplexed - YouTube
頻道連結：Hyperplexed
我也非常喜歡這個頻道，雖然他影片數比較少，但每一個品質都很好，除了節奏很順以外，最厲害的是他會講解做這些特效的思路，而不是單純寫程式碼給你看～一直都很期待他的更新！
六、Lun Dev - YouTube
頻道連結：lundevelop
這是我近期發現的頻道，品質也很不錯，會針對一個 CSS 屬性或網頁特效來講解～
Creative Coding
七、Patt Vira
頻道連結：Patt Vira
這是專門介紹 p5.js 的頻道，前陣子我對 p5 很有興趣時，找教學就看到了他的頻道，讓我大開眼界，很多特效應用是我想都沒想過的，如果你對這個領域很有興趣，相信從這裡入手會對你有幫助～！
八、Franks Laboratory
頻道連結：Franks laboratory
Franks Laboratory 主要分享基於 Canvas API 和 JvaScript 的特效，常常很多誇張的 canvas 特效他都有教，像以下這個影片的範例。
九、The Coding Train
頻道連結：The Coding Train
非常有名的頻道，我覺得他最有趣是有一個系列是，先帶你瞭解物理原理後，用程式碼寫出物理效果～
網頁 3D 動畫
十、Wawa Sensei
最後，想學習 3D 網頁動畫的話就一定要看這個頻道！這個頻道專注於 Three.js 和各種 3D 視覺效果，不用擔心沒有練習的素材～
結尾
以上就是我精選的 10 個 YouTube 頻道，不管你是初學者還是進階開發者，都能在這些頻道找到適合自己的學習資源。