마(피아)왕 게임 개발 기록

총 개발 시간 : 25시간
개발 방식 : 98% 바이브 코딩
아키텍처 : TypeScript + React + Zustand + TailwindCSS (Vercel 배포), TypeScript + Node.js + Express (Render 배포), WebSocket

포인트

 부엉이 게임을 하면서 오프라인에서 여러 명이 모여 웹페이지로 플레이하는 방식에 꽂힌 것인지, 비슷한 방향의 게임을 하나 더 만들게 되었다. 고등학교 친구들과 7명이 모일 기회가 있어 ‘7명이면 오리지널 게임 하나 만들어가야지’ 했다가, 결과적으로 25시간을 투자하게 됐다.

 뱅 + 시계탑에 흐른 피 느낌의 직관적인 치고받는 재미를 구현하려 했는데, 아직은 기대만큼 재미가 나오지는 않는 것 같다. 작업을 더 이어가야 할지는 고민 중이다.

카드게임을 만들 때 사용했던 구조와 기술 스택을 거의 그대로 재활용했다. 다만 가장 큰 차이점은 진짜 실시간 게임이라는 점이다.

 카드게임은 내 턴에는 나만 행동하고 상대 턴에는 상대만 행동하지만, 이번 게임은 실시간 소셜 게임이라 상호작용 타이밍이 따로 제한되지 않는다.

 서버에서는 WebSocket 이벤트를 수신하면 즉시 큐에 넣고, 큐에 들어온 플레이어 액션을 하나씩 순차 처리한다. 별도의 워커나 분리 서버는 두지 않았고, 비동기 싱글 스레드 기반으로 처리했다.

Document Driven Vibe Coding

이번에도 빠른 개발을 목표로 하다 보니, Cursor에 많은 부분을 위임했다.

다음 문서를 먼저 작성한 뒤 Cursor에 넘겨 작업을 진행했다.

• 게임 기획
• 데이터베이스 스키마
• 프론트엔드 상태 관리(Zustand)
• REST API 명세
• WebSocket 이벤트 명세
• 서버 게임 상태
• 핵심 게임 로직 구현
• 화면 기획(Information Architecture)

다만 Cursor가 종종 누락을 발생시킨다. 구현 완료라고 나오지만 QA를 해보면 빠진 부분이 적지 않다.

그래서 문서를 기준으로 다시 구현을 돌린 뒤,
내가 QA를 하면서 빠진 부분을 하나씩 보완하는 방식으로 진행했다.

이 단계에서 코드를 깊게 들여다보기 시작하면 시간이 과도하게 소모될 것 같아, 코드 레벨 리뷰는 최소화했다.

개발 실력이 빠르게 늘고 있는지는 잘 모르겠지만,
적어도 프로토타이핑 속도 하나는 확실히 올라가고 있다.