鐵人檔案
本系列將循序漸進帶大家深入現代前端開發。內容涵蓋 HTML5、CSS3、JavaScript ES6+ 的基礎與進階技巧，進一步探討 RWD、效能優化、Web API、PWA、前端安全、測試與部署等主題。
同時，也會帶入前端框架（Vue.js 為主）與工具鏈（Vite、GitHub Actions），並在最後整合成一個小專案，展現完整的 Modern Web 開發流程。讓讀者能逐步累積完整的前端開發能力。
為什麼要學 JavaScript？ HTML → 負責結構CSS → 負責樣式JavaScript (JS) → 負責行為與互動 沒有 JS，網頁就像是一本靜態...
1. 運算子 (Operators) 算術運算子 let a = 10; let b = 3; console.log(a + b); // 13，加 con...
為什麼要用迴圈？ 如果要重複做一件事，與其寫十次console.log()，不如用迴圈讓程式自動跑。 1. for 迴圈 for (let i = 1; i...
學習目標 了解什麼是 DOM (Document Object Model)。 學會使用document.querySelector和document.get...
學習目標 了解什麼是事件 (Event)與事件監聽器 (Event Listener)。 學會使用addEventListener綁定多個事件。 學會事件物件...
學習目標 了解表單驗證的基本概念。 學會使用**正規表達式 (RegEx)**驗證輸入格式。 學會輸入錯誤時即時顯示錯誤訊息。 做一個小型登入表單 (含即時驗...
學習目標 了解 JSON 是什麼，以及為什麼它是前端最常用的資料格式。 學會在 JavaScript 中解析 (parse) 與序列化 (stringify)...
學習目標 了解Fetch API的基本用法。 學會處理**非同步 (Asynchronous)**操作。 學會處理 JSON 格式的 API 回應。 做一個簡...
學習目標 了解如何在UI 上顯示 Loading 狀態。 學會用try/catch來處理請求錯誤。 顯示錯誤訊息給使用者，而不是只停在 console。 做一...
學習目標 了解RESTful API 的設計原則（資源導向、HTTP 方法、狀態碼）。 學會使用Fetch API或Axio來呼叫後端 API。 實作前端與後...
