以 RGB — HEX Converter (色碼轉換器)做學習里程碑
若說Alpha Camp全端網路開發「學期一」是初試網路開發，那麼「學期二」則是網路開發大躍進。透過教學資源一步一步帶領，學習者就是按步就班，直到產出作品。
Alpha Camp 全端網路課程學期二結束了，期末考其中一題是做一個 RGB-HEX Converter。對我來說，這是個很棒的題目，可以結合很多學期二學到的概念及技巧。
如下圖：
連下面網址，先來試玩一下：
https://s19003045.github.io/Final-exam-A27-Q2-RGB-to-Hex-Converter/
這個程式主要功能：
- 於〈RGB input〉〈HEX input〉可輸入色碼值，或 於〈RGB slider〉scroll bar，最後於 HEX 區塊呈現混合後的顏色。
- 輸入 RGB 色碼，可取得 HEX 色碼，相反亦可。
如果不懂色碼，可以參考下面這個文章：
作品背後的技術及收穫
試玩後，我們來看一下，要完成這個作品做到了哪些事情，及需要什麼觀念或技術 ：
- 呈現網頁元素的內容，也給了它們樣式(美化)： HTML + CSS
- 將網頁元素依需求排版，手機與電腦會呈現不一樣的排版，是一個對手機使用者友善的介面：CSS 佈局、RWD ( Responsive web design)、bootstrap( 開源前端框架)
- 網頁可以與使用者互動，使用者可以輸入、click button、scroll，然後網頁依使用者動作而回應：JavaScript、DOM （ Document Object Model ）的操作與事件
- 使用者可以藉由這個網頁取得想要的色碼：色碼基本概念、JavaScript、DOM 的操作與事件
- 〈RGB input〉〈RGB slider〉〈HEX input〉三者皆可使用，並連動變化；〈RGB input〉〈RGB slider〉〈HEX input〉與 各自色塊連動變化：色碼基本概念、JavaScript、DOM 的操作與事件
- 將專案佈署到網路，所以可以讓使用者連結：git 指令、GitHub、GitHub Pages
- 若想進一步將部署到網路的 專案 說明清楚：README.md 的撰寫
學期二學到的觀念和技術，除了串接 API、 JavaScript 物件導向於上述專案沒有使用或深入，其他幾乎都派上用場了。
做出讓自己充滿成就感的作品
若說Alpha Camp全端網路開發「學期一」是初試網路開發，那麼「學期二」則是網路開發大躍進。這個學期完成了超多作品，包括打造個人網站、個人網站 RWD、客製化名片、Todo List、實作Movie List、User List、Alpha POS。其實每個作品都不容易，但是透過教學資源一步一步帶領，學習者就是按步就班，直到產出作品。
我自己蠻喜歡的另一個作品是「客製化名片」，可連結下面網址：
https://s19003045.github.io/createNameCard/#basicInfo
在這個作品中，把剛學成的 CSS 佈局、Bootstrap 前端框架、簡單的 JavaScript 技巧，結合 DOM 的操作，打造一個名片生成器，完成時，心中感動了很多天。
還有這個 => Todo List ：
https://s19003045.github.io/Todo-list/
Todo List 這個作品同樣需要用到 CSS 佈局、Bootstrap 前端框架、JavaScript、DOM 操作。裡面有個很實用的功能〈點擊一個元素，讓它跑到另一個地方〉，這樣的概念實作也為後來課程 Movie List 做預備 ─ 新增項目至 my favorite list或從 my favorite list 移除某個項目。
回顧及前瞻
回顧學期初訂下的目標，並檢視完成度：
目標一：每週一訂定當週學習規劃，週五前完成當週作業
有鑑於學期一的經驗，我特別調整了學期二的時間規劃。
學期一因為還在摸索學習方式，每週一課程出爐後，因為深怕上不完，每天就儘可能把時間填滿，也因此給自己過多的壓力。
於是，這學期，每週一課程出爐後，我先規劃瀏灠當週的課程及作業，然後平均分配至週一 ~ 五。如果當天完成進度後，還有多餘的時間，我可以選擇補充相關的知識或做更多的練習，又或者，我可以開始隔天的進度。如果當天來不及完成，我也不給自己太大的壓力，因為還會有六日的時間做緩衝。
這學期的時間規劃，實作起來相當成功，我有充足的學習體驗，但又不會給自己過多的壓力，可以保持心情愉悅地學習。
除了「客製化名片」因為在週日晚太專注作品實作而忘記截止時間，所以這作業遲交沒被批改到，其餘作業都在時間內完成，順利得到助教批閱。
提到「客製化名片」因為遲交沒被批閱，雖然心中有點 OOXX，但是看到自己用心的作品生成，那種喜悅已經勝過心裡的 OOXX。
目標二：每週瀏覽同學的提問、comment、作業，並給予回饋，也藉此向同學學習。
因為知道，瀏灠同學的作業並給予回饋，是未來工作中 code review 的準備，也是提升自己戰力的方式，所以訂下了這個目標。
學期二上半段有足夠的時間來做這件事，也從當中得到不錯的學習經驗。但到了學期二下半段，新的 topic 需要更多的時間，時間開始不是那麼夠用，也因此瀏覽同學的作業、提問、comment，頻率下降。
後來，期末考其中一個題目便是 review code，透過觀摩同學的作品並給予回饋來提昇自己的學習能力。
我相信這件事真的很重要！這學期做的不夠好，沒關係，學期三繼續設立這個目標。而學期二至學期三中間的空檔，也還可以透過觀摩其他網路上的作品來學這件事。
目標三：每二週於medium發文一篇，記錄學習。
我喜歡透過寫作的方式整理思緒，把心沉澱，甚至透過寫作來深化思考。這真的很有用！
這學期共完成了四篇：
打敗學程式過程中心中的巨人歌利亞 (108/6/17)
【聽課分享】找到你的WHY(108/6/27)
揣摩軟體工程師表達能力的重要性(108/7/3)
職涯訪談系列之一：談軟體工程師的養成(108/7/26)
對一個很久沒有提筆寫作的人來說，這件事的養成真的不容易，但是它真的值得我繼續做下去。
想想自己也因為許多其他人寫的技術文章而受益，也期待自己把自身經驗分享出來，讓一些人也可因此得到幫助。
我還是要感謝 Alpha Camp 提供了一個很棒的學習計畫，讓想學程式的我不用大海撈針。這裡有人指引道路，有學習社群提供支援及資源，還可以連結更大的技術社群，真的很值得！
要不要繼續報名學期三？當然，學了前端還不夠，繼續朝後端邁進！
