Grimity - 그림 커뮤니티 플랫폼

프로젝트 개요

한국의 픽시브를 목표로 하는 그림 커뮤니티 플랫폼으로, 현재 월 1,500명의 활성 사용자가 이용하고 있는 실제 운영 중인 서비스입니다.
7인 팀(웹 FE 2, 앱 FE 2, 백엔드 2, 디자이너 1)에서 개발하고 있으며, 주 1-2회 정기 배포를 통해 지속적으로 서비스를 개선하고 있습니다.

트위터 채널과 오픈 카카오톡을 통해 사용자 피드백을 실시간으로 수집하고, 이를 바탕으로 빠르게 개선하는 애자일한 개발 프로세스를 운영하고 있습니다.

기술적 도전과 해결

1. WebSocket 기반 실시간 DM 시스템 개발

사용자 간 1:1 실시간 메시지 기능을 구현하기 위해 WebSocket을 도입했습니다.
연결 상태 관리, 재연결 로직, 메시지 큐잉 등 실시간 통신에 필요한 다양한 엣지 케이스를 처리하여 안정적인 DM 시스템을 구축했습니다.

2. React Query v3 → v5 마이그레이션 주도

팀 내에서 React Query 업그레이드를 주도하여 v3에서 v5로 마이그레이션을 진행했습니다.
Breaking Changes를 분석하고 호환성 이슈를 해결하여 원활한 업그레이드를 완료했으며, v5의 새로운 기능들을 활용하여 데이터 페칭 로직을 개선했습니다.

3. Layout Shift 이슈 해결

아이콘 컴포넌트가 캐시 미처리로 인해 간헐적으로 화면에 표시되지 않는 문제가 발생했습니다.
원인을 분석한 결과 아이콘 데이터의 캐싱 전략에 문제가 있음을 발견했고, 상수화 처리를 통해 Layout Shift 이슈를 해결했습니다.

4. 랭킹 시스템 신규 개발

작가별, 작품별 랭킹 페이지를 신규로 개발하여 사용자들이 인기 있는 작품과 작가를 쉽게 발견할 수 있도록 했습니다.
실시간 조회수, 좋아요 수 등 다양한 지표를 기반으로 랭킹을 계산하고 표시하는 시스템을 구현했습니다.

5. 중복 컴포넌트 리팩토링

프로젝트 전반에 걸쳐 중복되는 컴포넌트를 발견하고 공통 컴포넌트로 리팩토링했습니다.
코드 재사용성을 높이고 유지보수 효율을 개선하여 개발 생산성을 향상시켰습니다.

성과

• 실제 운영 서비스: 월 1,500명의 활성 사용자가 이용하는 실제 서비스 운영 경험
• 안정적인 배포 사이클: 주 1-2회 정기 배포를 통한 지속적인 서비스 개선
• 사용자 중심 개발: 트위터, 오픈 카카오톡을 통한 실시간 피드백 수집 및 반영
• 팀 협업 경험: 7인 규모 팀에서의 협업 및 코드 리뷰 프로세스 경험
• 기술 리더십: React Query 마이그레이션 주도 등 팀 내 기술적 개선 리딩