團隊成員與目標
我們的小組名稱是 GPW,分別是 Ginger、Pierce、Wanaka(我) 開頭字母的縮寫,還真是相當隨意的隊名啊(笑)!
專案之所以想做電子商務平台的主題,是因為我們都對電商懷抱著很大的興趣,我自己也寫了一篇跟電商產業探究有關的文章,於是我們三個人很快就達成了共識,但就算決定好了主題,要從頭開始去一步步構築產品,還需要多方面的配合與準備,只有單純寫程式是絕對不夠的。
專案準備與工具
為了讓三個人的遠端協作能順暢地進行,能夠在規劃 user story、繪製 ERD 圖、工作分配上等等,完成階段性目標的同時,並迅速的了解彼此的狀況,妥善的專案管理是十分重要的,這邊簡單介紹 AC 推薦的和我們所採用的線上管理工具:
GitHub
Pierce 幫我們小組建置了一個 GitHub 團隊帳號,我們三人都權限可以管理,並且事先協調好在發出 Pull Request 後彼此互相輪替 Code review,並在確認完畢後由審核者來負責 merge。
Google Drive
我們利用 Google 雲端硬碟來進行與專案相關的資料共筆,開發流程的規劃、重要的參考資訊等等,通通紀錄在內,以及整體專案十分詳細的 user story 的內容,要特別感謝 Pierce 有著豐富的使用經驗帶領我和 Ginger 能輕鬆的應用上手。
Visual Paradigm
免費繪製 UML 、ERD 等圖形的平台,有許多的範例能參考,我自己繪製電商專案的 ERD 圖時,覺得使用上相當的順手。
Zoom
每週都會用 zoom 來進行小組視訊會議,解決一些專案上影響範圍較廣或是需要盡快處理的問題,專案初期比較忙碌時,一個禮拜甚至會有 3、4 次線上討論,每次都費時將近 2~3 個小時,然而值得的事疑難都有被解決,讓會議結束後,皆能朝向專案的完成更邁進一步。
Slack
這是我們進行團隊溝通的平台,當有些專案的的問題比較偏向個人負責的部分或是立即性不高時,我們會在 Slack 上互相討論與分享看法,並留下相關資訊的紀錄。
Trello
這是 AC 推薦的線上 Kanban 工具,利用這個進行任務的劃分和工作流程的對應,並把寫程式過程中,共同的參考資訊也簡單記錄在此,當各自認領好 user story 上的工作後,就依據實際上開發的功能開出 tickets。
而開發過程中如果程式碼有什麼 Bug 要修改或是可以改進的地方,跟隊友討論完畢後也會開一張 ticket,放入任務進度的安排中,但要緊的事,不論開了多少張 tickets,確實地去執行負責的部分並留下及時的紀錄,才是真正擁有了善用工具的精神。
Other
除了上面介紹的各種線上工具之外,我們也會使用 Facebook、Basecamp 等進行協作溝通上的補充,讓交流能變得更及時且有效。
然而不論選擇哪些工具去使用,團隊成員之間是否能做有效的溝通與理解,才是真正的合作核心所在,最終決定採取什麼樣工具來協助開發,彼此有共識就沒問題了。
開發過程
專案開始啟動後,同時 Lighthouse 上正釋出前端框架 Vue 的課程內容,而維元老師的購物車與金流線上工作坊也差不多是在那時間點舉行,於是我們就決定一邊學習新技術與知識,一邊學以致用的實踐在電商專案上。
我們採取前後分離的模式來實作專案,前端用 Vue 而後端則是用 Node.js + Express,在開始初步規劃 user story 不久後,就發現這種作法其實有不少的眉眉角角,比如前後端該如何互相配合?API 的規格會長怎樣?這個功能表現方式是如何?等等大大小小的問題,除此之外 ,ERD 圖的規劃與呈現,也讓我們絞盡腦汁去想像與設計。
在經過各自的思考、分享個人的想法、理解彼此的意圖、達成最後的共識,這四個階段不斷重複中,來進行團隊的磨合並培養默契,慢慢的 user story 和 ERD 圖也都逐漸完備起來,其餘的部分就隨著功能的開發演進,適當補充或修改,在這過程裡特別感謝 Sam 助教在討論探索中所給予的寶貴建議,讓我們能有方向和信心去前行。
打造產品的過程,由老練的 Pierce 擔任小組長進行專案管理,我和 Ginger 則從旁協助查遺補缺,而功能開發的任務分配方式採各自認領,因為我們 user story 寫得頗詳細與清楚,很容易就能在 Trello 上開出 ticket,來查看各自的負責的方向與進度,並且沒有太多開發有重疊之處,有趣的點在於,我們不是單純用前後端進行工作的分配,而是根據各自所負責開發的功能,自己從後端處理功能操作與邏輯的判定,架好一條 API 之後,再從前端串接 API 並能用 Vue 成功操縱資料渲染到頁面上,才算是完成負責的功能,這種作法讓我們確實前後端的部分都能有所參與跟鍛鍊。
而開發的途中 Bernard 校長特別強調寫測試的重要性,希望我們能夠把測試融入專案裡,為此又再度邀請維元老師進行測試線上工作坊活動,在學習過程中,Ginger 很快地就找到將測試添加到我們電商專案的方式,帶領小組如何去撰寫測試程式碼,並更進一步利用 Travis CI 和 coveralls 實踐自動化測試,省下我們不少探索的時間,我十分佩服他在測試上有這麼高的敏銳度。
很幸運的在 GPW 小隊裡,我的兩位隊友都相當的厲害,大家都很認真負責,可以放心把背後交給對方(笑),當自己遇到問題無法解決時,有隊友可以幫忙 cover,當大家都暫時無法解決問題時,一起合力來突破這個難關,我總是提醒自己不能扯團隊後腿,盡力的把的程式給寫好。
就這樣過了一個多月,我們的專案後端部屬在 Heroku 上,而前端則是用 GitHub Page 的方式呈現,總算是小有規模了。
Code review
在專案開發告一段落後,我們約了個時間跟 Sam 進行線上會議,麻煩他幫我們對這份專案進行點評,並根據業界的經驗給我們一些實作上的建議,也真的萬分感激他願意花費時間看我們的 code,並給予不少的回饋,無論是前端 UI 畫面強化使用者體驗部分,或是後端 Controller 裡的把商業邏輯的程式碼獨立成 module 再進行引入之處,各種切實的觀點都讓我們有恍然大悟之感。
此外 Sam 也介紹了一些 Heroku 上好用的外掛工具,如 Sumo Logic、New Relic APM 等,能夠進行 Logs 收集及查詢或是功能路徑所花費時間,幫助我們對專案能有著更客觀的了解,以便之後對專案的維護與優化有著更清晰的方向。
我的收穫
一、團隊合作的精神
自己獨自寫專案時,時間上的安排是很彈性的,但跟隊友合作時就不能那麼任性了,表定的時間內該完成什麼事就該認真去實行,除非有不可抗力事件;而我們隊友間也非常有互相體諒的精神,小組的成員來自不同的家庭,有著各自的生活與安排,像 Ginger 在專案剛起跑時還在服替代役,於是我們決定線上會議的時間點時,儘量都會選擇在三人都有空的狀況下,協作專案中適時的互補,團隊合作才能發揮最大的效益。
二、溝通與工具的使用
團隊協作的過程中,利用了各種線上工具與平台來輔助專案的開發,我覺得我們逐漸習慣了這些工具的存在,並確實地感受到其便利性,很難想像早期的工程師們是如何在這些線上工具還未普及與發達的時候,如何完成遠端的合作,想必是一段相當可歌可泣的歷史,我自己除了用 Trello 為畢業專案進行任務開票與管理之外,也會在個人看板上進行 Todo List 的安排;如何妥善去運用工具來達成有效率的行為管理,我覺得是一件很值得探討的事。
三、遇到問題的處理
而在開發的歷程裡,無論是專案事前規劃與準備,還是動工寫程式的過程中,我們踩到了各式各樣的坑洞;有些是剛學習前端框架 Vue 的時,我們對於 Vue 使用還不甚熟練,就興致沖沖想進行前後分離的作業,就造成得常去查看 Vue 官方文件,來確認作法是否可行;又或是在串接藍新金流時,邏輯順序的考慮是否真的妥當;另外還有功能開發到一半,才發現原本設計的 ERD 圖有不足之處需要調整;這些林林總總的問題鍛鍊了我們解決疑難時該有的正確心態,耐心的去面對絕對比置之不理來得更有幫助。
四、互相學習與成長
雖然我們有選出小組長並簡單分配每個人的定位,但這不代表扮演的角色是呆板不變的,每個人都有各自擅長之處,寫程式的各個階段,開發功能比較順利的人,都會無私分享自己的經驗與查找的資料,幫助隊友能更快的完成任務,從而促進專案的推進,每個人都有機會扮演到領航者的角色;就像是寫測試的環節裡,Ginger 分享他的思考脈絡,讓我們對自動化測試能更快理解,而專案管理方面,Pierce 建立了一套良好的管理與紀錄模式,讓團隊的運作能更為的順暢,這些體會使我深刻的理解到,好的團隊就像是經驗大補包,能讓人有大幅度的成長。
結語
特別感謝隊友 Pierce 和 Ginger,對嫩嫩的我有許多的包容,讓我有這麼珍貴的合作體驗,這份畢業專題雖說完成了一個階段,但我們 GPW 並不會就此滿足,仍然會持續維護與優化,無論是 UI 使用者介面改進,還是效能速度的處理等,還有很多方向值得我們去精進,學習是無止盡的,期許自己能包持謙虛的心態,成為一位能幫助他人解決問題的軟體工程師。
感謝耐心看完的你,如果覺得這篇文章還不錯的話,請幫我按個鼓掌吧!