[ZARO] 자취생 커뮤니티 플랫폼

과정
풀스택
노출 페이지
대표 이미지
자로대표.png
대표이미지
서비스 한 줄 소개
자취 생활의 빈틈을 채우고, 일상의 즐거움과 유용한 나눔을 만드는 자취생 커뮤니티 플랫폼입니다.
회차
12회차
5 more properties

1. 배경(Problem)

1인 가구의 수는 계속 증가하고 있지만 그들의 일상을 제대로 이해하고 돕는 서비스는 많지 않습니다. 특히 ‘자취’라는 생활 방식은 단순한 주거 형태를 넘어, 식사·소비·감정·정보 접근 등 다양한 문제를 내포하고 있습니다.
우리는 자취 커뮤니티 2000개 데이터를 분석하고, 뉴스·설문 등 2차 자료를 통해 자취인의 일상을 면밀히 들여다보았습니다. 그 결과, 자취인들이 가장 자주 마주하는 이슈는 크게 네 가지였습니다.
생활비 부담 (특히 주거비, 식료품, 쇼핑)
혼자 해결해야 하는 실생활 문제
산개된 정보 (블로그, 커뮤니티, 오픈채팅 등 파편적 이용)
외로움과 소통의 갈증
이들은 필요한 정보를 찾기 위해 검색을 반복하거나, 다주제 커뮤니티에서 유사한 경험을 찾으며 시간을 보내곤 합니다. 때로는 주변에 쉽게 물어볼 사람도 없어 실질적인 해결이 어려운 경우도 많았습니다. 우리는 이런 과정을 통해, 자취인의 삶에는 여전히 정보 접근성, 공감, 그리고 연결의 여지가 부족하다는 것을 인사이트로 얻었습니다.
반면, 자취인들은 분명히 연결되길 원하고 있었습니다. 유용한 자취 노하우를 공유하고 싶어 하고, 같은 생활을 겪는 사람들과 소통하길 원하며, 실질적인 생활비를 줄일 방법을 찾고 있었습니다. 하지만 이 모든 것들을 하나의 공간에서 온전히 해결해주는 서비스는 없었습니다.
그래서 우리는 고민했습니다.
자취인의 일상과 감정을 이해하고,
흩어진 정보와 단절된 연결을 하나의 플랫폼으로 모은다면 어떨까?
우리는 이 질문에서 출발해, 정보 공유, 공감 소통, 생활비 절약, 동네 기반 탐색까지 가능한 통합 커뮤니티 플랫폼을 기획했습니다.
자취인이 자취인에게 묻고, 나누고, 함께 살아가는 공간.
정보도 감정도 물건도—이제는 혼자 고민하지 않아도 되는 곳.
이것이 바로 우리가 이 프로젝트를 시작한 이유입니다.

2. 서비스 소개(Solution)

ZARO - 자취의 로망

“자취 생활의 빈틈을 채우고, 일상의 즐거움과 유용한 나눔을 만드는 자취생 커뮤니티 플랫폼”

핵심 유저

핵심 기능

1. 홈에서 자취인의 소식을 한눈에!
1.
상단 배너에서 새로운 소식이나 광고를 확인해요
2.
인기 게시글 섹션에서 지금 가장 주목받는 자취글을 볼 수 있어요
3.
커뮤니티 바로가기를 통해 관심 있는 주제로 빠르게 이동해요
4.
현재 위치 정보 기준의 지도를 확인할 수 있어요. 동네 탐방 지도로 바로 이동도 가능해요.
5.
자취인들의 이야기를 모아보며 오늘의 자취 커뮤니티를 느껴보세요
2. 자취인의 이야기, 게시판에서 나눠보세요!
1.
같이쓰자: 필요한 물건을 함께 구매하거나, 안 쓰는 물건은 나눠보세요
2.
자취일상: 꿀팁, 질문, 고민 등 자취 생활과 관련된 모든 이야기를 자유롭게 나눠요
3.
텅장일기: 이번에 산 물건 자랑해요! 후회템도, 꿀템도 환영!
4.
원하는 게시판에 들어가 글쓰기 버튼을 눌러 바로 작성해요
5.
댓글과 좋아요로 서로 공감하며 따뜻
3. 우리 동네, 자취인끼리 탐방해요!
1.
지도를 중심으로 자취인의 장소 즐겨찾기를 볼 수 있어요
2.
직접 다녀온 단골가게, 카페, 마트 등을 기록하고 공유해요. 후기가 아닌 메모를 저장해 특별한 기록을 할 수 있어요.
3.
내가 저장한 장소는 즐겨찾기로 모아두고 언제든 다시 찾아볼 수 있어요
4.
동네 정보가 쌓일수록, 자취인에게 더 유용한 동네가 됩니다!
4. 내 자취 기록을 한눈에, 프로필 페이지!
1.
내가 작성한 글과 댓글을 모아볼 수 있어요
2.
좋아요한 게시글을 다시 보고 싶을 때도 쉽게 찾을 수 있어요
3.
즐겨찾기한 장소도 한 곳에서 확인 가능!
4.
자취인의 발자취가 모이는 공간, 나만의 자취 히스토리를 관리해보세요
5. 내 정보는 내가 관리해요!
1.
간편한 회원가입 및 로그인으로 자취 커뮤니티에 바로 참여할 수 있어요
2.
로그인 후에는 나만의 프로필 이미지, 닉네임, 자취 시작일 등을 자유롭게 수정할 수 있어요
3.
관심 있는 글에 좋아요를 누르거나, 댓글을 남기며 활발한 활동을 이어갈 수 있어요
4.
자취인의 개성과 정보가 담긴 프로필로, 더 풍성한 커뮤니티 경험을 즐겨보세요
6. 당신을 위한 기능들
검색
키워드로 게시글을 빠르게 찾아보세요
알림
댓글, 좋아요, 팔로우 소식을 실시간으로 받아보세요
카카오 로그인
버튼 한 번으로 빠르게 시작해요
휴면/탈퇴 처리
원할 땐 쉽고 깔끔하게, 개인정보도 안전하게 관리돼요

시연 영상

3. 아키텍처 및 핵심 기능

ERD

ZARO는 User를 중심으로 기능별 책임이 명확히 분리된 구조로 설계되었습니다.
커뮤니티 도메인
게시글, 댓글, 좋아요, 신고 등 커뮤니티 기능이 User와 연결되어 있으며,
사용자 간 상호작용을 기반으로 콘텐츠가 생성·확산됩니다.
소셜 도메인
팔로우, 알림 기능을 통해 사용자 간의 관계와 실시간 상호작용을 지원합니다.
위치 기반 탐색 도메인
장소 즐겨찾기, 그룹, 장소 등은 위치 정보를 기반으로 사용자 맞춤형 탐색 경험을 제공합니다.
운영 및 보안 도메인
휴면 처리, 비밀번호 재설정, 이메일 인증 등 민감한 기능은 별도의 테이블로 분리하여 관리합니다.
이를 통해 서비스 운영 효율성과 보안 안정성을 동시에 확보했습니다.
→ 전반적으로 도메인별 책임과 기능이 명확하게 나뉘는 구조로 설계되어 유지보수성과 확장성을 고려했습니다.

기술 스택 및 라이브러리

Frontend
Framework: Next.js (TypeScript 기반)
Styling: Tailwind CSS
State Management: Zustand
Data Fetching: React Query
Client Storage: IndexedDB (idb)
Rich Text Editor: Toast UI Editor
External APIs: Kakao API
CI/CD: GitHub Actions
Code Quality: ESLint + Prettier
Deployment: Vercel
Backend
Build Tool: Gradle
Framework: Spring boot, Spring Data JPA
Auth: Spring Security + JWT
Search Engine: Elastic Search
Database : MySQL(RDS)
Cache Server: Redis
Storage: AWS S3
Real-time: SSE (Server-Sent Events)
Infrastructure : Docker, AWS EC2
CI/CD : Jenkins

역할 및 업무 분담

4. 기술적 도전

Frontend : 댓글 수정 경험 개선을 위한 Optimistic UI 도입

도입 배경
수정 버튼 클릭 → 수정 API 요청 → 응답 후 댓글 목록 refetch → UI 반영
하지만 위 방식은 다음과 같은 UX 문제를 초래:
서버 응답을 기다리는 동안 수정 내용이 반영되지 않아 사용자가 “정말 수정된 건가?”라는 불안함을 느낌
전체 댓글을 다시 요청하면서 불필요한 리렌더링과 API 호출이 발생
느린 네트워크 환경에서는 입력한 내용이 사라지는 듯한 사용자 혼란이 발생함
도전 과제
서버 응답을 기다리지 않고 수정된 댓글을 즉시 UI에 반영해야 하는 동시에, 실패 시 정확하게 복원할 수 있어야 함
댓글 구조에 맞게 임시 상태를 가공해 캐시에 반영하는 로직 설계 필요
에러 발생 시 원본 데이터와 사용자 입력 내용을 어떻게 처리할지에 대한 복구 전략이 중요
해결 방법
React Query의 useMutation과 캐시 조작을 통해 Optimistic Update 방식의 댓글 수정을 구현
배운 점
댓글 수정에 Optimistic UI를 적용하면서 빠른 반응성과 데이터 신뢰성 사이의 균형을 잡는 방법을 알게됨
실시간으로 상태를 반영하되 실패에 유연하게 대응하기 위한 캐시 백업과 복원 전략의 중요성을 경험함
React Query의 캐시 조작 기능은 서버 상태를 직접 다루지 않고도 정교한 UX 개선이 가능하다는 점에서 매우 유용함
이후 개선 방향
현재는 댓글 목록 전체를 캐시로 다루기 때문에 작은 수정도 전체 invalidate 발생
→ 댓글 ID 단위로 queryKey를 분리하거나, 구조화된 캐시(normalization)를 적용하면 효율적
특히 댓글이 많아질수록 부분 invalidate 전략이 성능에 유리함

Backend : 헤더 인증방식 SSE를 이용한 실시간 알림 기능 도입

도입 배경
커뮤니티 서비스 특성 상 유저 간 상호작용이 많음 → 사용자 경험 개선을 위한 실시간 알림 기능 도입 결정
WebSocket, polling 등의 선택지
⇒ 서버 발신(단방향)만 필요한 기능 + WebSocket보다 가벼운 SSE(Server-Sent Events) 선택
(Polling : 주기적 요청에 따른 서버 부하와 UX 지연 문제 / WebSocket :양방향 통신이 불필요)
도전 과제
인증 기반 SSE 연결 초기 시도: 쿠키(access_token) 기반 인증 → localhost:3000 ←> localhost:8080 환경은 연결 ⭕️ → localhost:3000 ←> ec2 크로스도메인 환경에서 인증&연결 → Vercel 프록시(Nginx) 환경에서는 쿠키 미전달 / 차단 이슈 발생
해결 방법
쿠키 인증 방식 ⇒ Authorization: Bearer 헤더 인증 + EventSourcePolyfill 라이브러리 도입
서버: JwtHandshakeInterceptor에서 JWT 토큰 파싱해 사용자 인증 후 SSE 연결 허용 + 연결유지용 ping 스케줄링 전송
클라이언트: event-source-polyfill 사용해 Header로 access token 전송ping 응답 처리로 heartbeatTimeout에 도달하지 못하게 연결 유지에러 발생 시 자동 재연결 설정(지수 백오프 전략)과 제한+ access token refresh에 따른 토큰갱신&재연결 로직 구성
배포 환경에 따른 SSE의 민감도
Vercel 배포환경의 Proxy(Nginx) 특성상 SSE 메시지가 버퍼링되어 지연 출력→ 서버 응답 헤더에 X-Accel-Buffering : no 설정 추가하여 환경별 설정 조정
배운 점/개선 방향
SSE는 단순 연결 외에도 인증, cross-domain 환경, 토큰 갱신 등 고려할 요소가 많았음
안정적인 실시간 알림 시스템을 위해 연결 유지, 자동 재연결 구조까지 설계해 본 경험
향후 FCM(Firebase Cloud Messaging) 기반 모바일 푸시 알림 도입으로 개선

Server : Jenkins 기반 배포 자동화 및 무중단 배포

도입 배경
Jenkins를 로컬에서 실행하여 자동 배포 불가, 수동 실행 반복
3시간 단위 배포로 실시간 반영 어려움 → API 반영 지연 이슈
빌드 중 API 사용 불가로 팀원 문의 빈번
도전 과제
Jenkins 서버 이관 → 팀원이 함께 사용 가능하도록
GitHub 기반 배포 자동화 구축 → 백엔드 배포시 API 바로 사용
서버 중단 없이 배포 가능한 구조를 최소 비용으로 구성
기존 local Jenkins - 3시간 마다 배포
수정 후 server Jenkins - main merge 트리거 자동 배포
해결 방법
Jenkins EC2 이관 + GitHub SCM 연동
Jenkinsfile 버전 관리 → 변경 이력 공유
팀원 계정 추가 → 빌드 상태 실시간 확인 가능
Blue-Green 배포로 진행하려 했으나 메인 서버와 동일 스펙의 서버를 2개 사용하는 비용을 절약하고 싶었음
메인 서버(t3.large) = 빌드 + 이미지 생성
서브 서버(t3.small) = 실행 전용
프록시 전환 스크립트로 메인서버 서브서버 핫스탠바이 전환
젠킨스 스크립트
배운 점
CI/CD 전환 → 팀 기반 운영 환경 구축 경험
리소스 최적화 + 무중단 배포 → 실제 서비스 운영 관점의 고민 경험

5. 자체 평가 및 회고

스프린트별 회고

잘한 점

test code 작성 경험이 좋았습니다.
error를 체계적으로 처리해서 좋았습니다.
스프린트 미리 정해놓은 것과 스프린트 별 시간 확인과 버퍼시간 두었던 점 좋았습니다.
서버관리를 잘 해줘서 편안했습니다.
코어타임 운영, 휴식시간 보장 너무 좋았습니다.
디스코드, zep 등 커뮤니케이션을 통해 문제해결이 빨라서 좋았습니다.
깃허브 이슈를 잘 활용한 것 같아서 좋았습니다.
새로운 기술 많이 경험해서 좋았습니다.

아쉬운 점

동시성 문제가 일어나지는 않았지만 관심 갖고 해결해보지 못해서 아쉽습니다.
진행 중 엔티티 필드 수정에 두려움을 느꼈습니다.
프로젝트 기간 중 아주 잠깐 해이해졌습니다. 하하.
SSR, CSR 아직은 조금 어렵습니다. 프로젝트를 빠르게 진행하다보니 기술을 아주 깊이 이해하는데 아쉬움 있었습니다.
예상치 못한 버그 등장으로 작업시간 늦어지는 것이 아쉬웠습니다.
최종 회고

6. 팀 소개

자취는 혼자지만, 개발은 함께
ZARO 프로젝트를 통해 우리 팀은 실무에 가까운 기술과 협업을 경험했고, 이제 현업에 뛰어들 준비가 되었습니다.
Frontend
김성민 | ksmini0212@gmail.com FE리드
Backend
김나현 | knahyuk@gmail.com 팀 리드
이지은 | eun773c@daum.net
심동훈 | ehdgbstla@gmail.com BE리드
코드가 이븐하네 팀의 강점
🤝🏼 커뮤니케이션
디스코드로 언제든 편하게 소통하면서, 문제나 이슈가 생기면 바로 공유하고 같이 해결했어요. 덕분에 효율적이고 빠르게 진행할 수 있었죠.
성실함
매일 빠짐없이 데일리 스크럼을 했어요. 자발적으로 꾸준히 참여한 덕분에 프로젝트가 안정적으로 흘러갔어요.
신뢰와 책임감
출퇴근 시간은 자율! 주말엔 푹 쉬고, 평일엔 각자 책임감 있게 일했어요. 특히 코어 타임에는 자연스럽게 ZEP에 모여 집중하며, 서로에 대한 신뢰를 쌓아갔습니다.