team project · 팀장

MIMYO

실시간 경매와 작가–구매자 소통을 결합한 핸드메이드 커머스 플랫폼

2025.03.31 – 2025.05.08GitHub ↗발표 자료 ↗
메인 — 인기 작품
메인 — 인기 작품
6인
팀 (팀장)
5.5주
개발 기간
39
담당 기능
HTTPS
실서버 배포

01개요

대량 생산 제품과 차별화된 핸드메이드 상품을 거래하는 커머스 플랫폼입니다. 일반 판매에 더해 실시간 경매, 작가와 구매자의 1:1 실시간 채팅, 사용자 활동 기반 상품 추천을 제공하는 것을 목표로 했습니다.

6인 팀의 팀장으로 기획·역할 분담·DB 설계·Git 브랜치 운영을 맡았고, 주문·결제·경매·인증 등 핵심 도메인 대부분을 직접 구현한 뒤 Naver Cloud에 HTTPS로 배포했습니다.

02기술 스택

Frontend
ReactRedux Toolkitstyled-componentsChart.jsCKEditor 5STOMP.js · SockJS
Backend
Spring Boot 3Spring SecurityJWTOAuth2 ClientJPA · Native QueryWebSocket(STOMP)
DB
MySQL
External API
Toss PaymentsGoogle · Kakao · Naver OAuthDaum 우편번호JavaMail
Infra
Naver Cloud (Ubuntu)NginxLet's Encrypt · Certbot

03아키텍처

Browser
React · Redux
Nginx
HTTPS · 리버스 프록시
React 정적 파일
Spring Boot API
REST · STOMP
MySQL
Toss · OAuth · Mail
외부 API

Naver Cloud Ubuntu 인스턴스 1대 · Let's Encrypt 인증서 자동 갱신 · HTTP → HTTPS 리다이렉트

04담당 역할

주문 · 결제

  • 주문 그룹 – 주문 – 주문 옵션 3단 구조 설계 및 결제 상태에 따른 주문 프로세스 구현
  • Toss Payments 결제 / 전체·부분 취소 / 부분 환불
  • 결제 중 재고 경합 차단, 배송지 등록·쿠폰 적용 옵션 처리
  • 주문 내역(취소·환불·구매 확정)·판매 내역(주문 확인·배송 등록) 상태 처리 및 UI
  • 스케줄러 기반 2주 후 자동 구매 확정, 정산 내역

실시간 경매 · 커뮤니케이션

  • 경매 등록, STOMP 기반 실시간 입찰, 스케줄러 경매 마감 처리
  • 마감 경매 낙찰·즉시 구매 시 주문 생성 및 결제 연결
  • 유저 오버레이(정보 보기·쪽지·채팅·신고) 설계 및 구현
  • 쪽지·신고·신고 처리, 1:1 채팅 이미지 전송
  • 결제·배송·입찰 등 프로세스 결과 자동 쪽지 알림

인증 · 회원

  • JWT 인증 기반 로그인, Google·Naver·Kakao OAuth2 소셜 로그인
  • 이메일 인증을 통한 비밀번호 찾기
  • 사용자 등급·등급 포인트 지급, 스케줄러 기반 등급 처리

상품 · 추천 · 이벤트

  • 상품 – 옵션 – 카테고리 구조 설계 및 상품 등록·수정·삭제
  • 카테고리별 검색·주제별 정렬, 무한 스크롤 페이징(useInView)
  • 상품 추천 알고리즘, 메인 인기 카테고리·인기 작품·인기 작가 필터링
  • 이벤트 등록·기간별 진행/종료 처리, 출석 룰렛·멜론 게임 이벤트(쿠폰·등급 포인트 연계)
  • 검색·접속 등 사용자 활동 로그 저장

프론트 구조 · 팀 운영 · 배포

  • Redux로 검색어·모달·상호작용·로그인 상태 전역 관리
  • 헤더·마이페이지·관리자 대시보드 초기 구조 및 라우터 구성, 드래그 가능한 플로팅 버튼
  • DB 관리, Git 브랜치 전략·파일 시스템 총괄
  • Naver Cloud 서버 배포, Nginx 리버스 프록시, SSL 인증서·도메인 연결

05주요 기능

상품 판매 · 검색 · 추천

  • 옵션 대분류/소분류 단위 재고, 가격·할인율·배송비 설정, 이미지 1~5장 드래그 앤 드롭 첨부
  • 이벤트·대상·카테고리 다중 필터와 다양한 정렬, 무한 스크롤
  • 메인: 기간별 이벤트 배너, 관리자 등록 서브메뉴, 월간 인기 카테고리·작품·작가
메인 이벤트 배너
메인 이벤트 배너
상품 검색
상품 검색

실시간 경매

  • STOMP 채널을 경매방 ID별로 분리해 참여자에게만 입찰 정보 브로드캐스트
  • 시작가·현재가·즉시 구매가·남은 시간·입찰 인원 실시간 반영
  • 보증금(시작가 10%) 기반 입찰, 상회 입찰·낙찰·즉시 구매 시 자동 쪽지
  • 인기(입찰자 수)·마감 임박 Top 50 목록
경매 상세
경매 상세

채팅 · 쪽지 · 커뮤니티

  • 작가–구매자 1:1 실시간 채팅(상품 문의 채팅은 상품 정보 표시), 이미지 다중 전송, 읽음 표시
  • 어디서든 같은 컴포넌트로 동작하는 유저 상호작용 메뉴(정보 보기·쪽지·채팅·신고)
  • 프로필 방명록·팔로우, 리뷰(별점·이미지·좋아요)
1:1 채팅
1:1 채팅
마이페이지 프로필
마이페이지 프로필

이벤트 · 관리자

  • 월별 이벤트 페이지, 하루 1회 출석 룰렛, 멜론 게임 이벤트(점수 기반 쿠폰·등급 포인트)
  • 관리자: 신고 처리, 정산 처리, 기간별·상품별 판매 통계, 쿠폰 지급, 서브메뉴 관리
  • 마이페이지 활동·구매·판매 통계(Chart.js), 판매 내역 엑셀 다운로드
이벤트
이벤트
관리자 판매 통계
관리자 판매 통계

06DB 설계

ERD
ERD
  • 상품 – 옵션(대분류) – 옵션 카테고리(소분류) 구조로 옵션 조합별 재고 관리
  • 주문 그룹 – 주문 – 주문 옵션 구조로 상품 구조와 대응시켜 주문·판매 내역을 세부 단위로 조회
  • 주문 그룹 상태: 결제 전·결제 취소·결제 환불·부분 환불·부분 취소 / 주문 상태: 결제 완료·배송 전·배송 중·배송 완료·판매자 취소·구매자 취소·환불·정산 완료

07트러블슈팅

결제 도중 다른 사용자가 먼저 구매해 재고가 초과되는 문제

문제
같은 옵션 상품을 여러 명이 동시에 결제하면 실제 재고보다 많이 팔릴 수 있음
원인
장바구니·결제 페이지에서 확인한 재고와 결제 승인 시점의 재고가 달라질 수 있음
해결
Toss 결제 승인 요청 직전에 옵션 소분류 단위로 재고를 다시 검증하고, 초과 시 주문 그룹을 폐기한 뒤 결제를 중단(quantity_over 응답)

묶음 주문의 부분 취소 · 부분 환불

문제
한 번의 결제에 여러 상품·옵션이 섞여 있어 일부 상품만 취소·환불하기 어려움
원인
결제 단위와 상품·옵션 단위의 주문 상태가 하나로 묶여 있으면 개별 상태 관리가 불가
해결
결제 1회 = 주문 그룹, 상품 1개 = 주문, 옵션 소분류 1개 = 주문 옵션으로 분리해 그룹 상태(부분 취소·부분 환불)와 주문 상태(배송·정산 등)를 따로 관리

경매 마감 직전 입찰(스나이핑)

문제
마감 직전에 입찰이 몰리면 다른 참여자가 대응할 시간이 없음
원인
고정된 종료 시간 기준으로만 마감 처리
해결
마감 5분 이내 입찰 시 종료 시간을 1분 연장하고, 서버 스케줄러가 주기적으로 마감된 경매를 정리해 낙찰 주문을 생성

추천 결과 중복 · 후보 소진

문제
새로고침마다 같은 상품이 반복 추천되거나, 활동 이력이 적은 사용자는 추천할 상품이 없음
원인
찜·장바구니·조회·리뷰·검색 이력 기반 후보군이 작고 이미 보여준 상품을 구분하지 않음
해결
후보를 섞은 뒤 이미 추천한 상품을 제외하고, 후보가 모두 소진되면 평점·리뷰·찜·조회·주문 수 가중 점수 기반 기본 추천으로 대체

08회고

  • 기능이 늘어날수록 코드 복잡도가 커지는 것을 겪으며, 초기 구조 설계와 DB 정규화의 중요성을 체감
  • 실시간 기능(경매·채팅)에서 동시성과 데이터 동기화 처리의 어려움을 경험 — 재고 검증은 애플리케이션 레벨 확인이라 DB 락이나 조건부 차감으로 보강할 여지가 있음
  • 배포 직후 자동화 봇의 무차별 접근을 겪으며 방화벽·SSH 보안 등 인프라 보안까지 고민하게 됨
  • 팀장으로서 기획·역할 분담부터 개발·배포까지 전 과정을 리드
Gunmo Lee