鐵人檔案
這系列將紀錄我一個程式小白，用 30 天挑戰成為前端新手工程師的學習歷程。內容會從最基礎的 HTML、CSS、JavaScript 開始，逐步帶到常用的排版工具與套件（如 Tailwind），並實作小專案來驗證學習成果。除了技術筆記，也會分享我使用線上資源（如 Codecademy）的心得，讓初學者能快速找到學習方向。希望能透過這 30 天的實戰分享，讓更多人看到「從零開始學前端」的可能性！
想學做網站卻不知道從哪開始？其實只要先搞懂「前端」和「後端」的差別，再掌握 HTML、CSS、JavaScript 三大基礎，就能入門前端世界！在了解如何寫網站...
剛開始想學寫網站，卻不知道要先裝什麼工具嗎？今天帶你10分鐘完成環境安裝，再送上我私藏的前端自學網站清單，讓你不再卡關，馬上開始打造自己的第一個網頁！ Visu...
今天要學會 HTML 最重要的基礎：網頁結構、文字標籤、清單標籤。最後，我們來試著寫一頁「自我介紹頁」！ 一、HTML 基本結構 一個完整的 HTML 網頁，基...
昨天我們學會了 HTML 的基本結構、文字標籤與清單，做了一個自我介紹。今天要再進一步，學習如何在網頁中插入圖片、建立超連結，以及整理資料用的表格，做一個簡單的...
這幾天一路學下來，我已經能在網頁上放文字、加圖片、做連結，甚至還能用表格排版資料，看起來就像一個小小網站了 🎉。不過，如果網頁只能「秀給別人看」，那感覺還少了一...
學了這麼多天，感覺工具箱越來越滿了。我會放文字、加圖片、做連結，也能排表格，甚至昨天還讓使用者能填表單！今天的任務就是 —— 把這些元素都串起來，做一個屬於自己...
哇～一轉眼已經到第七天啦 🎉！回想這一週，我從最基本的 HTML 骨架開始，慢慢認識了標題、段落、清單，再到圖片、連結、表格，昨天甚至還做了小名片。感覺就像拼拼...
還記得你只有打開 HTML 檔案的時候嗎？是不是覺得畫面就是一堆黑白文字，頂多加個< h1 >標題看起來比較大一點點。沒錯，HTML 本身就像是「房...
昨天我們學到 CSS 就是「幫網頁打扮的設計師」。今天開始，我們就要從最簡單、最有感的地方下手：顏色、字體、背景。這三個元素，就像你決定今天要穿什麼衣服、搭什麼...
你有沒有想過，為什麼一個 < div > 看起來像是一個方塊？其實在 CSS 世界裡，所有元素都是一個「盒子」(Box)。這個「盒子」就像積木，你要...
