2024 切版直播班 - 每日任務
はじめに
💭 原子習慣：作者詹姆斯·克萊爾提到，每天只要進步1%，一年後你就會成長37倍。這意味著小而持續的改變，像原子一樣累積，最終產生巨大的影響。
目前參加 六角學院 - 2024 切版直播班 的每日任務，每天一個小小的切版觀念，不知不覺中知識就進入了腦袋。
其他還有 ↓
每日任務列表
Day 01 ~ Day 10
Day 02: 移除圖片空隙
Day 03: CSS 選擇器運用
Day 04: 推擠方向
Day 05: margin、padding 混合運用
Day 06: box-model 觀念
Day 07: box-sizing
Day 08: 觀念選擇題
Day 09: 練習 Emmet 語法
Day 10: margin: 0 auto、text-align 混合運用
===
Day 11 ~ Day 20
Day 11: 文字設定（font-size、line-height)
Day 12: 整合相同樣式
Day 13: 文字設定（font-family、font-weight、font-style)
Day 14: 垂直水平置中
Day 15: flex 多屬性練習
Day 16: flex 完成九宮格排版
Day 17: background-image
Day 18: container 容器應用
Day 19: 線上 icon 載入
Day 20: CSS 權重覆蓋
===
Day 21 ~ Day 30
Day 21: RWD 觀念選擇題
Day 22: RWD 版型、RWD 排版間距
Day 23: 表單設計
Day 24: jQuery toggleClass
Day 26: 錨點練習
Day 27: SCSS 結構、SCSS 用法
Day 28: SCSS 排序
Day 29: mixin
Day 30: 練習導入與使用元件
===
Day 31 ~ Day 40
Day 31: 表單練習與 spacing 的運用
Day 32: 元件與通用類別 I
Day 33: 元件與通用類別 II
Day 34: Modal 與 collapse 元件實用
Day 35: 網格練習
Day 36: Bootstrap position 與背景圖片遮罩設定
Day 37: Swiper 輪播套件介紹
Day 38: Swiper 客製化樣式（第六週 - 精選文章區塊）
Day 39: Bootstrap Navs and tabs
Day 40: Background linear gradient
===
Day 41 ~ Day 43
Day 41: Bootstrap input group
Day 42: Animation - 練習 keyframes
Day 43: 練習 transform
主線任務的回顧
第一週主線任務
其實第一週主線跟課前任務是一樣的，但在課前的時候用自學時的知識切了一次，在實際上課後又再重切了一次，
code 相較課前任務時候乾淨了一點，
但由於 flex 的不熟悉以及對於 html 結構的安排還不夠好所以寫起來還是很亂；😶🌫️
而 css 的部份學習了使用 SCSS 並且使用了變數來寫。
第二週主線任務
這週主要開始練習 OOCSS 的方式，容器與內容分離的慨念(說實在到現在還是很容易沒有完整分離)，
並且也開始學習使用 import 的方式把元件分離，但這時候對於哪一些應該分離哪些不需要、並且也因為之前習慣全部寫在一起，所以邊寫邊抽離造成很多時間一直在找 code 在哪裡或是沒吃到效果也找不到問題在哪。🤔
第三&四週主線任務
忘了說第二週開始就已經禁止使用 codepen 繳交作業，自學的時候都是寫一頁式網站或是僅區塊的練習，
沒有實際寫過多頁式的網站，在整個佈局規劃上面超級混亂。
本週開始學習使用 Vite 來進行多頁式網站的開發，ejs 的使用完全找到新天地的感覺，
不過後來聽前輩說由於框架太方便的關係，已經沒有人在使用 Vite 進行開發了。
不過做一些小型的多頁式網站還是蠻方便的。
navbar 的 RWD 真的是我的大魔王…(😭)
第五週主線任務
第五週是偏向前端後台介面的開發，並且學習開始使用 Bootstrap。
因為剛開始學習 Bootstrap，各種一直翻文件找 class 名稱超級累，
而且雖然好像只要套元件好方便的感覺，但由於還不太懂實際的應用以及客製化的方式，
有時候會卡在不知名的問題上面或是沒辦法調整至跟設計稿一樣。
整個卡到很煩躁~這時候對 Bootstrap 又愛又恨。😒
第六週主線任務 (大魔王來了)
這裡會說大魔王一方面是因為：
- 任務等級難度提升：(頁數均不含 modal)
LV 1｜任選兩頁含 RWD
LV 2｜至少做兩頁含 RWD，其中一頁必須為首頁 - 當週一定要提交並通過 Lv2 以上等級才能參加
六角 x AAPD 設計前端研發營
吐血我 🫠 第六週設計稿真的超美的~ (立flag：之後有空想要好好的重切完整一次)
因為時間來不及這次就完全沒有管什麼元件分離不分離，並且也沒空去專研什麼 swiper、nav & tabs..., 網頁交互 0。真的就是純切版 😥
並且在最後 CTA 的區塊，怎麼推都不推不好，最後就放棄了這一塊。(然後現世報馬上就要來了…上機考)
切版截圖 - 當時時間不夠就不管這一塊了，沒想到…
設計稿
第七週主線任務
快樂第七週 😃，一方面是因為魔王二號(第八週)又要來了所以老師安排一個輕鬆的主線在兩個魔王之間。
第七週只需要將之前的作業套上動畫套件即可，教學使用了 AOS 套件 好玩簡單又有效，10 分鐘不到即可做完本週作業。
就可以繼續去趕第八週作業了…同時!!
也開始了 六角 x AAPD 設計前端研發營 ，一開始表訂是會在課程結束後才開始，
結果不知道臨時有什麼變故，跟第八週的作業時間疊在一起，
造成開發時長雖然有兩週但全部人實際作業只有第二週的時間進行跟設計師的溝通與開發。
大家深刻的開始感受到工程師的職場生活 🤣
第八週主線任務
第八週是組隊任務，所以每個人的工作吃重反而比較輕一點點，
但是因為有作業繳交期限問題，所以我們也只能在一週內共完成四頁的討論、分工與切版。
也剛好是組隊任務的關係，我們專題小組就決定把第八週任務當成是專題任務的一個模擬練習，
這個部份會比較長一點，就另外開一篇分享啦~
👉🏻 第八週主線任務 - 模擬專題任務
最後に
切版直播班已經完美結業，成功的在期限內提交了 10 份作業拿到了學霸獎狀。(灑花花💮
期限內繳交 10 份作業(含助教 review 通過)才能拿到的學霸獎狀
在結業後還有一場切版的上機考試，主要是考切版觀念與實作。這裡就先不說考試結果了，想知道就看這裡 👉🏻 切版上機考
Discussion