Skip to content

[EPIC] 채팅방/캐치마인드 게임 분리 및 연동 개선 #168

Description

@DDINGJOO

Epic 개요

현재 채팅방과 캐치마인드 게임이 하나의 WebSocket 연결과 훅에서 혼합 관리되어 버그 발생 및 유지보수가 어려운 상태입니다.
채팅과 게임 도메인을 명확히 분리하여 안정성과 확장성을 개선합니다.

목표

  1. 타이머 동기화 버그 수정 - 클라이언트-서버 시간 동기화 문제 해결
  2. 도메인 분리 - 채팅/게임 메시지 및 상태 관리 분리
  3. UI 컴포넌트 분리 - 채팅 전용 / 게임 전용 컴포넌트 명확화
  4. 확장성 확보 - 새 게임 추가 시 기존 코드 수정 최소화

현재 문제점

1. 상태 관리 복잡도

  • `useChatWebSocket.js`에서 채팅 메시지, 게임 상태, 그리기 데이터 모두 관리
  • 책임 분리 부재로 버그 추적 어려움

2. 타이머 버그

  • `roundStartTime` 서버-클라이언트 시간 동기화 문제
  • `serverTime` 필드 부재로 정확한 타이머 계산 불가

3. WebSocket 메시지 혼재

  • 채팅/게임 메시지 구분 없이 동일 핸들러에서 처리
  • `domain` 필드 없음

아키텍처 변경 방향

```
현재: 단일 연결 + 혼합 상태
┌─────────────────────────────────────┐
│ useChatWebSocket │
│ - messages[], gameState, drawing │
└─────────────────────────────────────┘

변경 후: 도메인 분리 + 독립 상태
┌──────────────────┐ ┌──────────────────┐
│ useChatWebSocket │ │ useGameWebSocket │
│ - messages[] │ │ - gameState │
│ - USER_JOIN/LEAVE│ │ - drawingData │
│ │ │ - scores │
└──────────────────┘ └──────────────────┘
```

Stories

Tasks (Story별)

Story 1: 타이머 버그 긴급 수정

Story 2: 메시지 도메인 분리

Story 3-5: 상세 Task는 각 Story 참조

참고 문서

  • `docs/architecture-separation-proposal.md` - 상세 분리 방안

담당

일정 (예상)

주차 작업 내용
Week 1 Story 1, 2 (타이머 버그 수정 + 메시지 도메인 분리)
Week 2 Story 3 (훅 분리)
Week 3 Story 4 (UI 분리)
Week 4 Story 5 (게임 세션 API 연동) + 통합 테스트

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions