這系列將紀錄我一個程式小白,用 30 天挑戰成為前端新手工程師的學習歷程。內容會從最基礎的 HTML、CSS、JavaScript 開始,逐步帶到常用的排版工具與套件(如 Tailwind),並實作小專案來驗證學習成果。除了技術筆記,也會分享我使用線上資源(如 Codecademy)的心得,讓初學者能快速找到學習方向。希望能透過這 30 天的實戰分享,讓更多人看到「從零開始學前端」的可能性!
前幾天我們已經學會讓網頁有反應(事件、輸入、點擊),但今天要更進一步 —— 學會「直接操控畫面元素」! DOM(Document Object Model)就是...
恭喜你!一路從 HTML 到 CSS,再到 JavaScript,你已經掌握了製作網站的三大核心技術 🎉現在,是時候讓它們合體出擊 ——進入我們的第四週主題:小...
到目前為止,我們已經用 HTML + CSS 做出一個 待辦清單(To-Do List) 的外觀。今天要進入最有趣的部分:讓清單真的可以「互動」🎯 今日目標完成...
昨天我們做出了會動的待辦清單 ✅但如果你一關掉網頁,清單就不見了對吧? 今天,我們要讓它變成「會記得你的任務」的版本!我們會新增兩個進階功能: 1️⃣ 按下 E...
到目前為止,我們的 To-Do List 已經能: ✅ 新增任務✅ 標記完成✅ 刪除項目✅ 儲存資料 但現實生活中,我們常會想:• 「我想只看還沒完成的任務」•...
我們已經成功讓待辦清單可以「新增、刪除、標記完成」任務,甚至能記住資料。今天,我們要幫它換上漂亮的外衣——學會做出 亮色 / 暗色主題切換(Light / Da...
我們已經學習了前端三巨頭-HTML、CSS、JS的基本架構也透過所學製作出一個可愛方便好用的記事本網頁接下來就來教大家一個在寫網頁時非常好用的工具「Tailwi...
恭喜你走到這裡!這一路從 HTML、CSS、JavaScript,到昨天的 Tailwind 開發環境,你已經具備打造網站的完整基礎囉~ 今天,我們要把之前的「...
恭喜你走到系列的最後階段 🎊經過前 28 天的努力,我們從零開始學會了:HTML 打地基、CSS 美化外觀、JS 加上互動、Tailwind 快速開發。 而今天...
恭喜你! 你真的完成了整整 30 天的前端入門學習從一開始的 HTML 架構,到 CSS 美化,再到 JavaScript 互動、Tailwind 快速開發,最...