本文件連結：https://hackmd.io/1unuaLHzStmyXfZiCmKHJQ

# 直播班，預習課程觀看順序

影音課程連結：https://courses.hexschool.com/courses/enrolled/2762668

### 每堂 “課前” 建議掌握進度

> 許多知識很難透過一次性學習就能理解，因此提前釋出預習課程讓同學能夠提前學習，如果時間有限建議可以參考以下的說明進行掌握。
時間允許的情況下，可在 7/2 第一次上課前學習至第三週進度

#### 第一堂：1 px 也不差的版型控制術

- HTML - VS Code 網頁編輯器、HTML 基礎教學
- HTML - CSS 常用語法
- HTML - 使用 CSS 變更 HTML 標籤特性
- 課前最終作業一

#### 第二堂：Flexbox 網頁排版術

- Flex 網頁排版技巧
- Flex 精神時光屋
- 課前最終作業二
- 字體設定全攻略
- 第二週補充知識

#### 第三堂：伸縮自如的 RWD 手機網頁排版術

- 第三週 RWD 直播錄影 - 上半部
- 第三週 RWD 直播錄影 - 下半部
- 常見版型佈局設定
- 容器與內容分離的格線系統設計

#### 第四堂：多頁式網頁設計

- GitHub Pages 免費架站空間教學
- 第四週 - GGV 任務 - 前端任務管理工具教學

#### 第五堂：後台表單設計

- 表格與表單設計技巧
- Bootstrap 5 - 環境建置
- Bootstrap 5 - Bootstrap 文件介紹
- Bootstrap 5 - Flex 與網格系統介紹
- Bootstrap 5 - 通用類別 Utilities 與 工具 Helpers
- Bootstrap 5 - 表單運用

#### 第六堂：導入網頁規範設計流程

- Bootstrap 5 - Bootstrap 最實用的工具 - 元件
- Bootstrap 5 - Bootstrap 與神奇的 Sass

#### 第七堂：視差滾動

- GSAP 動畫效果

#### 第八堂：CSS 模組化管理

> 可選，非必看
- 2022 Tailwind 直播錄影回顧