給第一次學前端的你

從第一個網頁開始，做出自己的作品

你不需要先會寫程式。從打開第一個 HTML 檔案開始，逐步完成個人網站、互動功能、資料串接與 TODO Web App。

0先備知識

28個學習步驟

84小時完成作品

NEW · CREATION PATH

學完不只會照著做，還能自己定義作品

28 章各有一個不重複的創作挑戰，從模仿、改造、遷移走到獨立創作。每章都要做選擇、避免照抄、留下驗收證據；第 13、20、28 章完成創作關卡。

START HERE

每一章都會先說明成果，再帶你理解概念，不需要一開始就背一堆術語。

你會拿到一份可以修改的半成品，跟著 TASK 一步一步完成自己的版本。

中途有檢查點，最後才看完成範例。卡住時先找證據，再決定要改哪裡。

YOUR PROJECT

把姓名、介紹、圖片與連結放進一個真正能開啟的網頁。

加入導覽列、Hero、作品卡片、手機版排版與有目的的互動效果。

讓網站取得 API 或試算表資料，並完成產品列表與聯絡表單。

完成 TODO App、理解登入與權限觀念，最後把作品部署到網路上。

LEARNING ROUTE

不用一次想像 84 小時的全部內容。每一階段只替同一個作品多加一種能力，完成後就會留下可以展示、可以說明的成果。

WHEN YOU GET STUCK

先看畫面

是整頁空白、某個區塊不見，還是按鈕沒有反應？先把症狀說清楚。

再找證據

確認檔案、儲存狀態、路徑或瀏覽器訊息，不要一口氣把整份程式碼重寫。

最後核對

先回到本章的中途檢查與答案位置對照，完成後再看完整範例。

DETAILED LESSONS

正在跟課程進度時，先從上面的作品路線找目前階段；需要查單章內容時，再從這裡進入。