這是一篇紀錄前後端合作的專案
專案介紹:
Alpha camp的畢業專案是做一個類似Twitter的社群平台，此專案分為兩階段，第一階段是在11天內完成基本功能(ex: 登入/登出、回覆推文、個人資料修改…)，第二階段則是黑客松挑戰，在2天內使用Socket.IO 套件開發聊天室功能。
負責的部分:
與後端隊友討論後，我先完成基礎建設，如 登入/登出、model建立、資料庫功能。而在功能開發的部分我主要負責 使用者相關功能(如 個人資料修改、發推文、註冊功能)。
開發過程:
在開發前我們先進行了小組討論，我提供了事先大略寫好的後端的api規格表並搭配figma，把所有頁面全部run過一次，像是前端會傳什麼資料過來，後端會回傳什麼資料回去…等等。討論完後，我與另一位後端再將剛剛討論的東西整理並決定如何分工 及 交接開發進度。
開發過程中我們主要使用Line、Github、Trello來輔助開發，在第一次討論完後，將預計開發的項目一一列在Trello上，把開發過程做分類並把工程拆解為一張張卡片，依照開發進度來管理卡片的分類。
收穫與學習:
因組員4人皆為上班族且只能透過線上討論來開發專案，此時"溝通"就很重要了，在這次開發過程中遇到許多問題，像是後端回傳資料格式為何? 發 PR 後出現 conflict 就要討論哪部分該取捨保留? 如何將回傳資料整理成前端需要的格式? …。每經過一次溝通，都讓我學習到更多，學習到commit該怎麼寫才能讓後端組員Goater容易理解內容、與前端組員討論可以更加瞭解前端的運作方式，進而讓開發更加快速。 在與人協作的過程中不論是在技術層面或是溝通方式都有許多可以讓我學習，包括討論結束Claire會統整重點並分享、Darric提出問題的表達方式、goater善用github工具來解決conflict，在這專案過程中，謝謝幾位給力的組員總是保持著積極正向的態度，讓專案可以在時間內完成。
接著在第二周的周末是要完成黑客松挑戰，實作功能前，我們先試著查看socket.io官方文件及搜尋有關socket.io套件的資料，然後我先在本地利用bootstrap簡單做出一個聊天室頁面，再搭配找到的資料來實作多人聊天室功能。在實作過程中，因為socket.io是以事件來傳遞觸發，無法透過console.log來debug，所以我只能猜測問題大概出在哪，不斷的修正、push 到heroku再與前端討論問題點在哪。
在聊天室功能實作時遇到最大的困難是前後端連線時遇到CORS問題與事件傳遞問題，查看錯誤訊息後嘗試了各種方式，但還是依然無法解決問題，後來前端找到一篇文章跟著操作後，解決了連線問題，不過這時又出現了新的問題，Client可以傳訊息到Server，但Client收不到Server的訊息，最後我們瘋狂爬文才發現原來是前端需再install vue-socket.io，此時時間已剩下6小時左右，我們抓緊時間趕工，在時間截止前完成了公開聊天室功能及保存歷史訊息功能。
這次專案讓我學到如果在初期的事前準備能更加完整的話，那開發效率也會更好，如果一開始就把所需的資料格式都規劃好的話，可以省下許多溝通的時間，並可撰寫一份更完整的文件來讓前後端都可以查看並補充內容。
最後謝謝我的組員Goater、Claire、Darric，雖然我們都是上班族，但也因為這樣大家能互相體諒互相幫忙，希望未來有機會我們可以再次合作優化這個專案。
