모각코 — 함께 집중하는 온라인 작업 라운지

프로젝트 포트폴리오 · Android 우선 MVP · Flutter · Spring Boot · AWS Lightsail

서비스 : https://mogako.xyz

모각코는 온라인 라운지에 모여 각자의 작업에 집중하는 서비스다. 서로 대화하지 않아도 같은 공간에서 누군가 작업하고 있다는 느낌을 주는 것을 목표로 만들었다.

기술 스택

아키텍처

사용자는 Flutter 앱 또는 웹 브라우저로 HTTPS :443에 접근한다. Caddy가 TLS를 처리하고 정적 랜딩 페이지는 직접 제공하며, API와 WebSocket 요청은 Spring Boot로 전달한다.

AWS Lightsail에서는 Caddy·Spring Boot·Redis를 Docker Compose로 운영한다. PostgreSQL은 외부 관리형 DB에 두어 애플리케이션 컨테이너와 데이터의 수명을 분리했다.

실제 도메인 기준으로 mogako.xyz는 랜딩·관리자 페이지, api.mogako.xyz는 API·WebSocket, downloads.mogako.xyz는 Windows 설치 파일을 제공한다.

이미지의 FCM·Kakao 로그인은 외부 연동 확장 지점이다. 현재 구현 기준으로 Firebase는 Analytics·Crashlytics, 소셜 로그인은 Google OAuth를 사용한다.

주요 기능

• 라운지: 작업실 입장, 좌석 배치, 참여 중인 멤버의 상태 확인
• 집중 타이머: 개인 집중 세션 시작·일시정지·종료와 작업 시간 기록
• 실시간 협업: presence, 채팅, 읽지 않은 메시지를 WebSocket으로 반영
• 공간 꾸미기: 캐릭터·책상·노트북·컵·소품을 조합해 작업 공간 구성
• 기록·커뮤니티: 일별 집중 기록과 모집·작업 기록·질문·자유 게시판 제공
• 멀티 디바이스: Windows companion 창에서 현재 작업 상태 확인

핵심 구현 포인트

상태를 세 가지로 분리했다

membership ≠ active presence ≠ personal focus

라운지 멤버인지, 현재 좌석에 연결되어 있는지, 개인 집중 타이머가 실행 중인지는 서로 다른 상태다. 이 경계를 나누어 네트워크가 잠시 끊겨도 집중 세션과 좌석 상태가 불필요하게 함께 종료되지 않도록 했다.

REST와 WebSocket의 역할을 나눴다

• REST: 최초 화면 snapshot, 목록 조회, 쓰기 요청, 누락 데이터 복구
• WebSocket: 라운지 상태, 채팅, 집중·presence 변경 이벤트

WebSocket 이벤트에는 sequence를 두고, 재연결 시 REST snapshot을 기준으로 상태를 다시 맞춘다. 실시간 연결을 정답 저장소로 만들지 않은 것이 핵심이다.

PostgreSQL과 Redis의 책임을 나눴다

PostgreSQL에는 사용자·멤버십·채팅·집중 기록처럼 보존해야 하는 데이터를 저장한다. Redis에는 세션·presence·좌석 lease·rate limit처럼 빠르게 바뀌고 만료될 수 있는 상태를 저장한다.

회고

• Caddy를 외부 진입점으로 두어 도메인, 정적 파일, API·WebSocket의 책임을 분리했다.
• 기능별 패키지 경계를 가진 Spring Boot 모듈형 모놀리스로 트랜잭션과 배포를 단순하게 유지했다.
• 가장 어려웠던 부분은 기능 수가 아니라 membership·presence·focus가 한 화면에서 조합되는 문제였다.
• 다음에는 도메인 command·event 계약과 snapshot·projection 관계를 더 일찍 문서화하고 싶다.