文科少女學程式

11月一整個月都沒有寫部落格，不是耍廢去了，而是去挑戰一個讓自己肝超級爆掉的活動，就是六角學院舉辦的【The F2E 前端 & UI 修練精神時光屋】。
會參加這個活動的原因主要是今年就快要結束了，眼看該產出作品的目標尚未達成，就藉由這個活動逼自己產出一些作品了！
其實一開始本來是想用React這三週的三個主題，但在白天需要上班的狀況下，想要一週產一個主題，對於React還沒有這麼熟練的我難度有點高，所以最後還是決定使用Vue3+TypeScript進行。

這三週我完成了哪些主題？
第一週：台灣旅遊景點導覽
這一週比自己預想還要快完成，因為有特別挑了一個比較好完成的設計稿，但其實這一週自己還算是在熱身階段，所以做的成品不算完整，也還有很多bug。另外，因為想要加快完成的速度，所以部分元件是使用element ui下去調整樣式來完成。
整體成品畫面大概是下面這張截圖的樣子，由於不太完整，就不貼出成品連結了。目前也預計用React重新寫一次這個主題！

第二週：自行車道地圖資訊整合網
這一週除了跟前一週一樣有使用TDX的API外，還挑戰了一個新東西，就是google maps api的串接，並且使用客製的marker、info window，以及地圖的折線路線。主要功能是查找附近的Youbike站，並且查看可借、可還的單車數量。(不專業成品連結)


第三週：全台公車動態時刻查詢應用服務
這一週是我自己還滿期待的主題，因為自己平常就是有在坐公車的人，所以還沒到第三週，就一直很期待可以完成這個主題。在這個主題裡面，一樣也使用了google maps api，能查看站牌地圖，也能查看目前即時的公車路線狀態。在這一週還特別加強自己的切版練習，所以沒有使用UI框架。(不專業成品連結)


這三週學習了什麼？
1. 第三方API串接
這三週讓自己學習的重點是放在串接第三方api這部分，所以除了串接TDX API外，還讓自己趁這次的活動去碰了以前就很想接接看的Google Maps API。因為這次的TDX API 因為是OData，所以也意外地接觸到OData的API查詢語法，這也是平常在公司碰不到的API使用方式。至於Google Maps API的串接部分，則是逼自己去閱讀官方文件，還有查找資料，也嘗試markers、polylines、info windows客製化的運用。
2. UI切版
UI切版雖然幾乎每天都會碰到，但也已經有一段時間沒有好好地完整切一整個作品的版面，透過這次的活動，又讓自己更熟悉切版，也從切版過程中遇到的問題，學習到更多切版技巧。
3. 時間管理
最後一個部分就是時間管理，這真的很重要！我沒有想到在下班時間後，還可以做這麼多的事情，而不是耍廢追劇就過去了。因為時間有限，也更珍惜使用每個零碎的時間，例如通勤時段查找相關資料，思考怎麼完成任務。每天真地都把時間排好排滿，都快變成時間管理大師了呢XD

這三週的挑戰心得
最後簡單記錄一下這三週的挑戰心得！
這三週說真的非常～非常～累！第一週整個就是一團亂，第二週則是心力交瘁，第三週甚至整個覺得體力快撐不下去了。但是頭都洗一半了，怎麼能半途而廢呢！所以就還是牙咬著撐下去了。這三週基本上就是白天上班寫code，晚上下班也寫code，為了趕進度，每天幾乎都是12點過後才睡，但是每天早上的重訓行程依然沒有漏掉，所以到後面幾天早晨的重訓一度覺得自己可能會倒下XD
不過累歸累，還是很感謝自己撐下去，雖然成品還沒到心中百分之百的滿意程度，但在這三週的期間，真的也學到不少東西，也有感受到自己的成長，覺得很開心。最後也很感謝我的室友大大！可以讓我在最後第三個禮拜不備餐，專心衝刺最後一個作品，還怕我在電腦前直接去了，所以在後面硬拖我出去走走XD

以上就是這次我就廢的挑戰紀錄！時不時還是會繼續讓自己廢到翻轉～