零基礎前端課程

28 MEETINGS · 180 MINUTES EACH

跟著每一次上課前進

每張卡都是完整 180 分鐘。遇到章節時數不等於 180 分鐘時，卡片會標出本次切片，以及下一次如何承接。

6 HANDOFF GROUPS

跨章不是跳課，是把同一段能力交給下一次

相同編號的交棒卡會說明本次留下什麼，以及下次從哪裡承接。

  1. 01Flex 導入：父層、主軸與交叉軸 → Flex 導覽列與兩欄實作課次 05–06
  2. 02DevTools 診斷導入 → CSS 優先權、重構與回歸驗收課次 10–11
  3. 03Git 初始化與第一個 commit → GitHub push、README 與 history 驗收課次 13–14
  4. 04Timer 核心：開始、暫停與重設 → 狀態除錯與重複啟動課次 18–19
  5. 05即時資料模型、adapter 與三態 → 即時更新失敗情境與復原課次 24–25
  6. 06部署前檢查與證據準備 → Netlify 正式部署、跨裝置驗收與成果展示課次 27–28

MEETING LIST

28 次課程

每張卡的章節分鐘數加總都是 180 分鐘。

  1. 課次 01180 分鐘
    1. 第 01 章 · 180 分鐘章節完整授課
      進入章節
  2. 課次 02180 分鐘
    1. 第 02 章 · 180 分鐘章節完整授課
      進入章節
  3. 課次 03180 分鐘
    1. 第 03 章 · 180 分鐘章節完整授課
      進入章節
  4. 課次 04180 分鐘
    1. 第 04 章 · 180 分鐘章節完整授課
      進入章節
  5. 課次 05180 分鐘跨章交棒 1 / 6
    1. 第 05 章 · 150 分鐘Hero 背景、遮罩與可讀性
      進入章節
    2. 第 06 章 · 30 分鐘Flex 導入：父層、主軸與交叉軸
      進入章節

    交棒：本次先建立「Flex 導入：父層、主軸與交叉軸」，下次繼續承接。

  6. 課次 06180 分鐘跨章交棒 1 / 6
    1. 第 06 章 · 180 分鐘Flex 導覽列與兩欄實作
      進入章節

    交棒：承接前次成果，完成「Flex 導覽列與兩欄實作」。

  7. 課次 07180 分鐘
    1. 第 07 章 · 180 分鐘章節完整授課
      進入章節
  8. 課次 08180 分鐘
    1. 第 08 章 · 180 分鐘章節完整授課
      進入章節
  9. 課次 09180 分鐘
    1. 第 09 章 · 180 分鐘章節完整授課
      進入章節
  10. 課次 10180 分鐘跨章交棒 2 / 6
    1. 第 10 章 · 150 分鐘CTA 狀態、transition 與 animation
      進入章節
    2. 第 11 章 · 30 分鐘DevTools 診斷導入
      進入章節

    交棒：本次先建立「DevTools 診斷導入」，下次繼續承接。

  11. 課次 11180 分鐘跨章交棒 2 / 6
    1. 第 11 章 · 180 分鐘CSS 優先權、重構與回歸驗收
      進入章節

    交棒：承接前次成果，完成「CSS 優先權、重構與回歸驗收」。

  12. 課次 12180 分鐘
    1. 第 12 章 · 180 分鐘章節完整授課
      進入章節
  13. 課次 13180 分鐘跨章交棒 3 / 6
    1. 第 13 章 · 120 分鐘作品集整合與回歸
      進入章節
    2. 第 14 章 · 60 分鐘Git 初始化與第一個 commit
      進入章節

    交棒：本次先建立「Git 初始化與第一個 commit」，下次繼續承接。

  14. 課次 14180 分鐘跨章交棒 3 / 6
    1. 第 14 章 · 180 分鐘GitHub push、README 與 history 驗收
      進入章節

    交棒：承接前次成果，完成「GitHub push、README 與 history 驗收」。

  15. 課次 15180 分鐘
    1. 第 15 章 · 180 分鐘章節完整授課
      進入章節
  16. 課次 16180 分鐘
    1. 第 16 章 · 180 分鐘章節完整授課
      進入章節
  17. 課次 17180 分鐘
    1. 第 17 章 · 180 分鐘章節完整授課
      進入章節
  18. 課次 18180 分鐘跨章交棒 4 / 6
    1. 第 18 章 · 180 分鐘Timer 核心：開始、暫停與重設
      進入章節

    交棒：本次先建立「Timer 核心：開始、暫停與重設」，下次繼續承接。

  19. 課次 19180 分鐘跨章交棒 4 / 6
    1. 第 18 章 · 60 分鐘狀態除錯與重複啟動
      進入章節
    2. 第 19 章 · 120 分鐘jQuery 舊碼閱讀與原生 JS 對照
      進入章節

    交棒：承接前次成果，完成「狀態除錯與重複啟動」。

  20. 課次 20180 分鐘
    1. 第 20 章 · 180 分鐘章節完整授課
      進入章節
  21. 課次 21180 分鐘
    1. 第 21 章 · 180 分鐘章節完整授課
      進入章節
  22. 課次 22180 分鐘
    1. 第 22 章 · 180 分鐘章節完整授課
      進入章節
  23. 課次 23180 分鐘
    1. 第 23 章 · 180 分鐘章節完整授課
      進入章節
  24. 課次 24180 分鐘跨章交棒 5 / 6
    1. 第 24 章 · 180 分鐘即時資料模型、adapter 與三態
      進入章節

    交棒：本次先建立「即時資料模型、adapter 與三態」，下次繼續承接。

  25. 課次 25180 分鐘跨章交棒 5 / 6
    1. 第 24 章 · 60 分鐘即時更新失敗情境與復原
      進入章節
    2. 第 25 章 · 120 分鐘Auth、uid 與權限邊界
      進入章節

    交棒：承接前次成果，完成「即時更新失敗情境與復原」。

  26. 課次 26180 分鐘
    1. 第 26 章 · 180 分鐘章節完整授課
      進入章節
  27. 課次 27180 分鐘跨章交棒 6 / 6
    1. 第 27 章 · 120 分鐘Mock 同步、失敗保留與重試
      進入章節
    2. 第 28 章 · 60 分鐘部署前檢查與證據準備
      進入章節

    交棒：本次先建立「部署前檢查與證據準備」，下次繼續承接。

  28. 課次 28180 分鐘跨章交棒 6 / 6
    1. 第 28 章 · 180 分鐘Netlify 正式部署、跨裝置驗收與成果展示
      進入章節

    交棒：承接前次成果，完成「Netlify 正式部署、跨裝置驗收與成果展示」。