想創建一個令人驚艷且視覺吸引的作品網站嗎？在這個教學中，我們將帶您通過使用強大的 Tailwind CSS 實用框架和 GSAP 來構建一個動態的 React JS 作品集，實現流暢的動畫效果。
主要重點：
• Tailwind CSS：學習如何快速有效地使用 Tailwind 的類別基礎方法來樣式化您的 React 元件。
• GSAP（綠箭頭動畫平台）：探索使用 GSAP 創建引人入勝的動畫藝術。我們將示範如何使用 GSAP 的滾動觸發功能來在滾動時揭示元素。
• Lenis：使用平滑滾動庫 Lenis 來增強用戶體驗。
• 最佳實踐：隨著我們實施 React 開發的最佳實踐，確保您的作品集既功能齊全又具視覺吸引力。
觀看此影片以學習：
• 如何設置一個帶有 Tailwind CSS 的 React 專案
• 創建自定義元件和佈局
• 利用 GSAP 實現滾動觸發的動畫
• 實現平滑滾動功能的 Lenis
無論您是初學者還是經驗豐富的 React 開發者，這個教學都將賦予您構建出色作品網站的技能。訂閱我們的頻道以獲取更多深入的教學和網頁開發技巧！
📁 資源：
-
GitHub 摘要：Henry Clark - 作品集摘要
-
原始碼（Patreon）：Henry Clark - 作品集原始碼
-
原始碼（Buymeacoffee）：Henry Clark - 作品集原始碼
-
ReactJS: https://react.dev/
-
Tailwind CSS: https://tailwindcss.com/
-
GSAP: https://gsap.com/
🔗 章節：
0:00 - 介紹
1:09 - 專案概述
4:09 - 專案初始化
17:12 - 使用 tailwind-scrollbar 樣式化預設滾動條
19:04 - 頁首
52:56 - 首頁
1:16:02 - 關於
1:25:33 - 技能
1:36:54 - 工作
1:51:26 - 評估
2:03:55 - 聯繫
2:22:47 - 頁尾
2:32:16 - 平滑滾動動畫
2:35:31 - GSAP 用於滾動顯示動畫
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式