[學習之路] VSCode 擴充套件備忘表
這篇文章純粹紀錄我自己在 Web 開發過程中實際用過、覺得方便的 VSCode 擴充套件,並不代表這些一定主流或特別好用,只是個人經驗隨手整理。內容不追求完整或熱門榜,純屬私人備忘,歡迎有興趣的人參考。 ※本清單會不定時更新,有新發現或更換習慣也會陸續補充。
這篇文章純粹紀錄我自己在 Web 開發過程中實際用過、覺得方便的 VSCode 擴充套件,並不代表這些一定主流或特別好用,只是個人經驗隨手整理。內容不追求完整或熱門榜,純屬私人備忘,歡迎有興趣的人參考。 ※本清單會不定時更新,有新發現或更換習慣也會陸續補充。

在現代 Web 開發中,前端應用通常需要與後端伺服器進行資料交換。RESTful API 是現今最常見的 API 設計風格,透過標準的 HTTP 方法(GET、POST、PUT、DELETE)來執行 CRUD(Create、Read、Update、Delete)操作。本章將學習如何使用 React 19 搭配原生 fetch API 來串接後端 API,實作完整的資料管理功能。

React 19 帶來了許多改進和新功能,特別是在 Hooks 的使用上更加完善。本文將詳細介紹 React 官方推薦的所有 Hooks,包括基礎 Hooks、效能優化 Hooks,以及 React 19 新增的 useActionState 和 useOptimistic,讓您能夠更好地掌握現代 React 開發技巧。

React 透過 State 管理元件的資料和渲染時機,透過 Props 由父元件向子元件傳遞資料。但當元件樹變得複雜時,Props 傳遞會變得繁瑣(Prop Drilling)。本章將學習 Context API 和 useReducer, 它們能幫助我們更優雅地管理跨元件的狀態共享和複雜的狀態邏輯。

在上一章節,我們已經完成了一個包含多個元件的 React 應用(MyLogo、MyH1、MyForm、MyGallery 等)。現在我們要把這個應用擴展成多頁面的學習系統,透過 React Router 實現課程切換功能,並添加側邊選單(aside menu)讓學習者可以自由切換不同課程內容。

本篇將深入探討 React 19 的核心概念與實作技巧,從 Vite 專案結構開始,逐步介紹 JSX 語法、元件設計、Props 傳遞、事件處理到狀態管理。透過實際範例,你將學會如何建構可重用的元件、管理應用程式狀態,以及掌握現代 React 開發的最佳實踐。

React 是由 Meta(前 Facebook)所主導開發的 JavaScript 函式庫,採用元件化(Component-based)的設計思維,讓開發者能以可重用的元件來構建使用者介面。與 Angular 類似都強調元件化開發,但與 Vue.js 的 MVVM 模式不同,React 將所有邏輯(資料、事件、渲染)都整合在元件內部。

TailwindCSS 是一個功能類優先的 CSS 框架,它提供了大量預定義的實用工具類,讓您能夠快速構建現代化的使用者介面。本課程將深入介紹 TailwindCSS 的核心概念、安裝方法,並提供完整的公式表供快速參考。

本篇將帶你了解為什麼需要非同步,以及如何用 Promise 與 async/await 優雅地撰寫非同步流程。接著我們用 Fetch 實作 AJAX 請求,並補充瀏覽器端儲存(Cookie、LocalStorage、SessionStorage)與 Session/Token 的觀念對比。