poker_tracker/
├── poker_tracker_app/ # 前端 React Native App (MVVM 架構)
│ ├── src/
│ │ ├── screens/ # View 層,所有畫面元件
│ │ ├── viewmodels/ # ViewModel 層,狀態與邏輯
│ │ ├── components/ # 可重用 UI 元件
│ │ └── models.ts # Model 層,資料結構定義
│ ├── App.tsx # App 入口,導航設定
│ ├── theme.ts # 主題與樣式
│ └── ... # 其他 RN 專案檔案
├── poker_tracker_backend/ # 後端 Golang API
│ ├── main.go # 伺服器啟動入口
│ ├── routes/ # API 路由
│ ├── handlers/ # 各功能處理邏輯
│ ├── models/ # 資料結構
│ └── db/ # 資料庫連線
└── ...
-
前端 (poker_tracker_app)
- 採用 MVVM 架構,
screens為 View,viewmodels管理狀態與商業邏輯,models.ts定義資料結構。 - 使用 React Native + TypeScript,UI 風格集中於
theme.ts。 - 主要畫面:首頁(Home)、新增場次(NewSession)、紀錄手牌(RecordHand)、歷史紀錄(History)、統計(Stats)。
- 狀態管理用
zustand,所有 session/hand/stats 操作集中於sessionStore.ts。
- 採用 MVVM 架構,
-
後端 (poker_tracker_backend)
- 使用 Golang,RESTful API 設計。
main.go啟動伺服器,routes註冊 API 路由,handlers處理請求,models定義資料結構,db管理資料庫連線。- 主要 API:/sessions, /session, /hands, /hand, /stats。
- 進入
poker_tracker_app目錄 - 安裝依賴
npm install # 或 yarn - 啟動 Metro
npm start # 或 yarn start - 執行 App
- Android:
npm run android或yarn android - iOS:
npm run ios或yarn ios(首次需先bundle install+bundle exec pod install)
- Android:
- 進入
poker_tracker_backend目錄 - 啟動伺服器
預設監聽在
go run main.go
:8080,API 可供前端呼叫。
- 新增/管理撲克場次
- 紀錄每一手牌結果
- 歷史紀錄查詢與排序
- 盈虧統計(總盈虧、勝率、分場地/盲注統計)
- Model:
src/models.ts定義 Session/Hand/Stats 結構 - ViewModel:
src/viewmodels/sessionStore.ts管理所有資料與邏輯 - View:
src/screens/下各畫面元件,僅負責 UI 呈現與事件觸發