今年疫情爆發進入三級警戒時，工作開始轉為遠端，當時幾乎很少踏出家門。於是跟女友開始以彼此都很喜歡的桌遊 — 矮人礦坑當作 Side Project 來當休閒娛樂(?)，沒想到大部分主要功能都完成了(以前很多 Side Project 半成品)，於是想來紀錄一下開發的過程。
分工、使用技術、系統架構
女友主要負責視覺設計、前端開發；我負責後端，以及一些自動化部屬、Server 等處理。
前端主要以 HTML、CSS、JQuery 開發，沒有使用前端框架。有針對手機版做 RWD。
後端選用 Node.js 的 Express 框架來開 API，主要是看上 Express 的輕量化，另外使用之前一直想好好研究的 TypeScript。
因為有實作連線功能，使用了 Socket.IO 來做長連線。Socket.IO 可以很方便的在 Client 和 Server 做使用，也有實作遊戲室所需要的 Room 功能。
資料庫選用 MongoDB，其實是想說把遊戲室所有資訊都放在同一個 Collection 就好，不太需要考慮正規化。
主機是架在 Linode Shared CPU Plans 最便宜的方案，一個月 $5。網域是之前在 GoDaddy 購買。目前是在主機裡面安裝 Nginx 做 Reverse Proxy，前端就會直接導到靜態檔案，後端看是 Http Request 或是 WebSocket 連線，對應到不同的 Server，後端 Server 會再跟 Database 互動。
大略的架構圖如下：
協作方式
開發任務狀態管理是採用 Asana，要開發的項目會新增一張 Ticket，透過不同 Column 來確認狀態流 (參考目前公司的管理方式)。
基本上會把需要開發的 Ticket 先建立在 Backlog，開始往 To Do、In Progress、Test、Complete 流動，然後可以 Assign 是誰負責。
開發目標會優先將主要功能 (連線、遊戲流程) 交付，盡快將第一版完成，才能讓使用者實際測試，優化細節則是主要功能沒問題後再來調整。
程式碼版本控制是用 Git (雖然大多時候都自己做直接 push)，一開始部署都是我去 Server Pull，後來受不了這個重複動作，就用 GitHub Action 來自動部署了。
參考文章：用 GitHub Action 自動部署程式碼到 Linode
功能介紹
這次的開發實作最主要的功能有：
- 遊戲室連線(開局、加入、遊戲互動)
- 卡牌規則、位置及方向判斷、玩家狀態、遊戲勝負
遊戲室連線
連線遊戲這部分我覺得有蠻多細節要處理的，目前主要功能流程為：
- 開局
由房主開啟新局，並複製房間邀請連結給其他參與玩家
2. 遊戲等候室
被邀請的玩家透過邀請連結進入後，會需要同步目前參與者狀態給房間內所有參與者。當然，離開、斷線等狀態也都需要 handle。
3. 遊戲互動
開始遊戲後需要處理的細節也滿多的，像是：
- 卡牌放置後，發新的卡給玩家
- 卡牌放置後同步房間內所有玩家目前桌面上的牌況
- 玩家個人狀態（輪到誰？道具是否有被 Ban？）
- 連線問題處理 (重整頁面或斷線後重新加入怎麼取得當前所有資訊)
- 遊戲每回合的 Log 同步
遊戲規則
目前遊戲是根據實際桌遊的規則，可以支援到 10 人一同遊玩，這邊其實花了滿多的時間在處理：
- 卡牌放置位置(地圖卡只能點終點、道具卡只能點玩家、道路卡只能放可以放的位置)
- 卡牌旋轉、旋轉後放置到地圖上的連接判斷
- 勝負判斷
如何判斷道路成功連到終點卡也是花了不少時間在測試跟研究，剛好看到國外也有人有做一個蠻酷的矮人礦坑 Project，就去參考他的演算法。
後續測試發現結束後要能夠讓同批玩家快速重啟新局，會是比較好的遊戲體驗，就有將此功能加入。
總結
這次的 Side Project 真的蠻好玩的，平常比較少接觸連線遊戲的設計，透過此次機會踩到了一些雷，也補進了相關設計知識。很享受做產品的樂趣，還有很多想做的功能還沒完成，目前這個 Project 也還在持續開發中。另外也想把後端的驗證機制、自動化測試補完整。後續有新的進度再寫成文章跟大家分享！
