30 天前，我們從一個對前端只聞其名的小白開始，跌跌撞撞地把 HTML、CSS、JavaScript 一點一點拼起來......
這過程就像蓋房子：

1. 先學會搭骨架 (HTML)
2. 再來上油漆裝潢 (CSS)
3. 最後安裝電燈冰箱、讓房子活起來 (JS)

到今天，這棟「網站小屋」已經有了基礎雛形。
今天這篇，就讓我們一起做最後的複習，回頭看看走過的路~

1. HTML：骨架的力量

功能：建立結構 → 文字、圖片、表單、清單、超連結

學到的關鍵：語意化標籤 (<header>, <nav>, <section>)，不只是「好看」，更能讓搜尋引擎、螢幕閱讀器理解!

心得：沒有骨架，網站就只是空氣

2. CSS：顏值即正義

功能：讓元素「看起來不一樣」。控制顏色、字體、排版、動畫

學到的關鍵：
display → 區塊怎麼擺
Flexbox / Grid → 讓版面自動調整，終結對齊ㄉ地獄!!
hover、transition → 增添小互動感

心得：寫 CSS 就像化妝 →讓頁面順眼又漂亮

3. JavaScript：網站的靈魂

功能：讓網站「活起來」，處理互動與邏輯

學到的關鍵：

• 變數、條件、迴圈、函式 → 基礎文法
• DOM 操作 → 選取元素、改文字、改樣式
• 事件監聽 (onclick, addEventListener) → 用戶一動，就有回應

心得：JS 就是網站的「神經系統」，沒有它只有死板的畫面

4. 三者融合：網站完整思路

做網站的心法流程：

1. 先想功能 → HTML 寫出結構
2. 再排版美化 → CSS 打理外觀
3. 最後互動 → JS 加靈魂

例子：做一個「登入表單」

1. HTML：輸入框、按鈕
2. CSS：對齊、邊框、hover 效果
3. JS：檢查輸入是否為空、按下送出後顯示提示

學習的心得與感想

這 30 天學前端，其實最重要不是背死語法，而是學會怎麼拆網站的功能。看到一個按鈕、一個表單，先想它是骨架（HTML）、長什麼樣（CSS）、還有怎麼動（JS）。先把骨架搭好，再排版美化，最後加互動和邏輯，這樣整個流程才不會亂掉。HTML 是骨架，CSS 是外觀，JS 給網站靈魂，三者缺一不可!

JS 的「狀態」概念超重要，不亂改 HTML，先改資料再渲染畫面，這種思維學框架或做大專案都很實用。寫程式出錯很正常，debug 本身就是在累積經驗，越做越懂流程和邏輯。

從小功能開始玩起來超有成就感，像按鈕點擊換顏色、表單驗證、動態列表生成，慢慢就能從零做到一個完整網站。重點是養成「先拆需求、想流程、再動手寫 HTML/CSS/JS」的習慣，這樣前端做起來會更順、也更有邏輯，最後做出來的網站才會漂亮又好用⁽⁽ଘ( ˙꒳˙ )ଓ⁾⁾。