커스터마이징 쇼핑몰 플랫폼

제품 등록부터 주문/배송까지, 브랜드를 위한 유연한 커머스 시스템

프로젝트 개요

NQNA Shop은 브랜드가 자체 상품을 등록·판매할 수 있는 풀스택 쇼핑몰입니다. 주문/결제/배송, 상품·카테고리·재고 관리, 이미지 업로드 자동화, 관리자 전용 CMS까지 포함합니다. Docker 기반 로컬/운영 환경과 CI/CD, 페이지별 SSR/ISR 및 반응형 UI로 운영 효율과 성능을 함께 고려했습니다.

서비스 화면

상품 목록 페이지
상품 상세 페이지
관리자 상품 관리 페이지
주문 관리 대시보드

주요 기능

상품 관리 시스템

  • S3 사전서명(Presigned) 업로드로 대용량 이미지 처리
  • 카테고리/가격/재고/옵션(SKU) 등 메타데이터 기반 등록/수정
  • Soft-delete로 안전한 비활성화

장바구니·주문·재고

  • 복수 상품 한 주문 처리, 장바구니 수량 조절
  • 결제 전 ‘재고 예약(hold)’ 후 결제 성공 시 확정, 미결제 시 TTL 만료
  • 오버셀 방지를 위한 재고 예약 원장 및 만료 잡

결제 연동 안정화

  • KakaoPay API 연동
  • 멱등키(Idempotency Key) 적용 및 콜백(웹훅) 서명 검증/리플레이 방지
  • 주문 상태 머신: Cart → PendingPayment → Paid → Fulfillment → Shipped → Completed/Cancelled/Refunded

회원가입 및 인증

  • JWT 로그인/회원가입, 이메일 인증, 회원 정보 수정/탈퇴
  • OAuth 로그인(카카오/구글) 및 Role 기반 접근 제어

관리자 전용 CMS

  • /admin 전용 메뉴, 상품/주문/회원/카테고리 일괄 관리
  • 재고 수동 조정, 감사로그(Audit Log)로 변경 이력 추적

이미지·성능 최적화

  • CloudFront 캐시/리사이징, WebP/AVIF 썸네일 파이프라인
  • Next.js SSR + ISR, SWR 캐싱, 에지 캐시로 LCP 개선

아키텍처 구성도

architecture-0
  • 프론트엔드: Next.js(SSR + ISR) + SWR 캐싱, CloudFront 에지 캐시
  • 백엔드: Spring Boot REST API + Spring Security, OpenAPI 명세
  • DB: MySQL(JPA). 재고 예약 테이블/원장(예약 TTL 만료 잡 포함)
  • 메시징/캐시: Redis(세션/레이트 리밋/재고 예약 TTL)
  • 결제: KakaoPay. 콜백 서명 검증, 멱등키/리플레이 방지, Outbox/Inbox 패턴으로 상태 일관성 보장
  • 이미지: S3 사전서명 업로드, CloudFront 캐싱/리사이징
  • 인증: JWT + OAuth2.0(카카오/구글), 관리자 RBAC, 감사로그
  • 인프라: Docker + Nginx, GitHub Actions CI/CD, (선택) Flyway/Liquibase 마이그레이션

기술 스택

프론트엔드: Next.js, TypeScript, Tailwind CSS, SWR
백엔드: Spring Boot, Spring Security, JPA, OpenAPI(Swagger)
데이터베이스/캐시: MySQL, Redis
이미지: AWS S3 + CloudFront
결제: KakaoPay API (서명 검증/멱등키)
인프라: Docker, GitHub Actions, Nginx
운영: 구조적 로깅, 감사로그, (선택) Flyway/Liquibase

담당 역할

문제 해결 및 성과

회고