Alpha Camp 學期 2–3 心得回顧(後端專修)
可以到這裡閱讀我寫的英文技術文章
學期 2–3 內容 (後端專修)
- 建立伺服器 API Endpoint 去接收不同的 HTTP Request
- 根據不同的請求，讓伺服器對 MongoDB Atlas 做不同的操作
- 根據資料庫回傳的資料，透過 View Engine 渲染靜態網頁至前端
- 部署到雲端伺服器 Heroku
- 重構程式碼
- 運用以上概念寫出：Todo List, Restaurants List, Password Generator, URL Shortener
學期 2-3 心得 (後端專修)
今天早上拿了一個 Exceeds Expectation 通過 2–3 期末技術驗證，一方面覺得對自己有交代，但更多的情緒是慶幸去年的自己決定要「全職學習」。
曾經和朋友在一間很棒的威士忌酒吧，聊到在工作上要維持績優的壓力有多麼可怕，所以當年在計畫轉職的時候，就不打算用一個太緊湊的時程把自己逼瘋，現在回頭看，真是明智，讓我在連續失眠的時候，拿出計畫表看，還可以發現自己完全超前進度，而默默放個心，繼續往前邁進
回到 Alpha Camp 進度制的內容，2–3 開始快速拓展各種新的領域，從純粹的 client-side JavaScript 開始延伸到 server-side JavaScript，而在 server-side 開始整合使用各種技術，包含了架設伺服器、設計路由、操控 NoSQL 資料庫、引用 View Engine 產出靜態網頁，而每一個方向，都有很深的知識可以挖掘。
全職學習讓我有寬裕的時間去維持全局觀，而不是反過來被單一工具限制眼界，再透過實作，親身體會到如何讓 JavaScript 從後端流到前端，前後之間如何透過 API 交流，和以使用者事件為中心設計產品的重要性。
花的時間開始比預期來的多，比方說期末作業花了我 10+小時，大部分的時間花在刻前端畫面、設計使用者事件和重構程式碼，中間還走了一個歪路，而實際在設計與實作後端邏輯，大約 1 小時。
下一步
- 把目前的網路作品用 Next 重新部署
- 思考一個求職作品，然後開始著手實作
- 投入最繁重的學期 3
加碼：自學經驗回顧 — 以短網址產生器為例
預期
我想要在前端只渲染一個按鈕，透過 addEventListener & removeEventListener 在不同的 state 賦予這個按鈕不同的任務，比方說，在一開始，這個按鈕按下去的功能，是從 API 取得短址然後渲染，當渲染完成後，同一個按鈕會變成 copy ，使用者點下去，就會把短址複製到剪貼簿
第一次失敗
當前端收到後端資料，渲染完成畫面後，而且按鈕也成功變成 copy 後，使用者點擊這個按鈕，甚麼事都沒發生，打開 Dev Tool 查看這個元件的監聽器，發現我想要他在這個階段監聽的事件和搭配的 handler，都在，但是沒有被觸發
第二次嘗試
在經過幾次除錯，但都沒有找到錯誤後，我突然注意到 event loop，然後突然很有希望的覺得應該是因為 event loop 讓我想要觸發的 handler 一直被卡在 queue 裡面，然後 stack 沒有清空，queue 裡面的東西就不會被推到 stack 去執行，想要跳脫，就要用事件去觸發 handler
這邊的邏輯有誤，但當時的我是這麼想的
而至今也沒有找到這個問題的根源
歡迎跟我分享，你覺得可能的根源是甚麼
按鈕從 Shorten 變成 Copy 的關鍵轉換點，是前端確實收到後端的資料後，但這個收到後端資料，又沒有事件可以使用，所以我把腦筋動到 custom event
當時的我一廂情願的覺得 custom event 是解方，查看了文件，在 20 分鐘後生出了呼叫 custom event 的 client JS
第二次失敗
這支有使用 custom event 的程式，完全沒有解決問題，同樣的狀況依然存在，有監聽器但沒有觸發對應的 handler
第三次嘗試
看到第二次失敗，我就知道是其他東西干擾了畫面渲染，而這個其他東西很有可能是我目前還沒學到的知識，所以為了達成任務，我有兩個選擇：
- 堅持一開始的設計，使用同一個按鈕，所以繼續找原因
- 不用同一個按鈕，但透過 client JS 去操控顯示哪一個按鈕
我最後選擇了後者，花了另一個 20 分鐘去修改 view engine, css & client js
第三次成功
當我把程式邏輯回歸簡單，就是一個元素賦予一次監聽器，而不是對同一個元素在那邊拆拆裝裝，整個流動就非常順暢
Takeaways
- 要像蛇一樣靈活，但靈活不代表躺平沒標準
- 寫得越簡單越需要功力
- 加碼：最後沒有用到，但順路學起了 custom event 的基礎用法
- 加碼：最後沒有用到，但除了 removeListener 還可以用 Abort
你也想成為軟體工程師嗎？
這些是我在 Alpha Camp 的所有心得，希望能幫助你做出選擇：
- Alpha Camp 學期一心得回顧
- Alpha Camp 學期 2–1 心得回顧
- Alpha Camp 學期 2–2 心得回顧
- Alpha Camp 學期 2–3 心得回顧 （後端專修）
- Alpha Camp 畢業專案 Twitter 小組協作回顧
- Alpha Camp 畢業，全學習心得回顧（後端專修）
我當初在猶豫要不要轉職，或者加入 Alpha Camp 的時候，苦無對象諮詢。雖然身邊有朋友有成功經驗，但當時的我還沒下定決心，只是想找個有第一手經驗，又不認識的人聊聊，免得這個可能只是稍縱即逝的念頭，在茶水間散播出去反而麻煩。
如果你想找個和生活圈比較遠的人聊聊轉職，聊聊 Boot Camp （我的經驗是 Alpha Camp），我們可以來一場 30 分鐘的對談，或許能幫助你蒐集資訊，做出決定，不過會酌收新台幣 $500，確保我們的對談品質。
直接到這裡預約即可，但請留意：
- 請在預約的同時轉帳（預約表單有轉帳資訊），如果查無轉帳紀錄，將取消預約
- 若有其他時段需求，請直接來信
