Skip to content

tech-stack.md

Latest commit

 

History

History
107 lines (82 loc) · 3.86 KB

tech-stack.md

File metadata and controls

107 lines (82 loc) · 3.86 KB
Raw

Detonator プロジェクト 技術スタック選定レポート

プロジェクト概要

  • 名称: Detonator
  • ジャンル: 協力型ローグライクマインスイーパーパーティーゲーム
  • プラットフォーム: ブラウザ (モバイルファースト、PC対応)
  • プレイヤー数: 1～10人リアルタイムマルチプレイヤー
  • 開発体制: 小規模学生チーム、AI支援開発
  • 用途: イベント使用 (非収益)

推奨構成 (最終決定)

1 技術スタックサマリー

【フロントエンド】
- エンジン: Phaser 3.x (TypeScript)
- ビルド: Vite 5.x
- UI: Phaser内蔵UI
- 状態管理: Colyseusクライアント
- デプロイ: 静的サイト (Netlify/Vercel/Cloudflare Pages)

【バックエンド】
- フレームワーク: Colyseus 0.17
- ランタイム: Node.js 20 LTS
- 状態同期: @colyseus/schema
- デプロイ: Docker on VM (DigitalOcean ~$4/月)

【モノレポ管理】
- パッケージマネージャー: pnpm 9.x
- ビルドオーケストレーション: Turborepo 2.x
- 共有パッケージ: protocol, schema, rules-core, config

【開発ツール】
- 言語: TypeScript 5.x
- Linter: Biome
- Formatter: Biome
- CI/CD: GitHub Actions (lint + typecheck + test)

2 意思決定マトリックス

決定項目 選択 主な理由
アーキテクチャ分離 ✅ 分離 (FE/BE) サーバー権威型必須、デプロイ独立性
モノレポ採用 ✅ 採用 型共有、アトミックな変更、小規模チーム向き
フロントエンドエンジン Phaser 3 Colyseus統合◎、AI効率◎、実績◎
バックエンド Colyseus リアルタイム同期専用設計、軽量
TypeScript ✅ 全面採用 型安全性、AI生成精度向上
UI層 Phaser内蔵 HUD最小限、複雑さ回避
ビルドツール Vite 高速HMR、最適化ビルド
ランタイム Node.js 20 公式サポート、安定性

3 開発フェーズ別の焦点

Phase 1: プロトタイプ (MVP)

  • Phaserでグリッド描画 + タッチ操作
  • Colyseusで基本的な状態同期
  • 1人モード動作確認
  • 妥協レベル: 高 (動けばOK)

Phase 2: マルチプレイヤー実装

  • 複数プレイヤー同期
  • 再接続処理
  • サーバー権威型の状態同期（クライアント予測は採用しない）
  • 妥協レベル: 中 (コア機能は妥協なし)

Phase 3: 体験の洗練

  • パフォーマンス最適化
  • UI/UXブラッシュアップ
  • バグ修正
  • 妥協レベル: 低 (可能な限り改善)

注意: Phase 2 の旧案にあった「クライアント予測 + サーバー調整」は破棄し、サーバー権威のみを採用する。詳細は docs/plans/api.md のプロトコル方針を参照。

実装開始時のチェックリスト

セットアップ手順

  • モノレポ初期化 (pnpm + Turborepo)
  • TypeScript設定 (共有tsconfig)
  • Biome 設定
  • apps/client: Vite + Phaser 3プロジェクト作成
  • apps/server: Colyseus + Node.js 20プロジェクト作成
  • packages/protocol: enum / interface / command / event 定義
  • packages/config: JSON 設定値（game-params, items, skills, stages, rewards）
  • packages/schema: Colyseus スキーマクラス定義
  • packages/rules-core: ゲームルール純粋関数群
  • CI/CD: lint + typecheck + test 追加
  • 開発環境確認 (localhost動作)

学習リソース