플러스프로젝트 배경
상품권 발행사별 검증 API 분기, 매입 할인율 실시간 계산, 관리자 이상 거래 모니터링 등 상품권 자동 매입 플랫폼의 핵심 업무 흐름을 먼저 파악하고, 상품권 종류 선택부터 핀번호 검증·예상 매입금 실시간 계산·계좌 등록·마이페이지 상태 추적까지 전체 사용자 흐름을 사전 구현했습니다. 핀번호 입력·매입 신청, 관리자 할인율 실시간 변경, 이체 완료 후 알림 발송 등 핵심 운영 시나리오 3가지를 사전에
프로젝트 성과
상품권 5종 전체 매입 신청 흐름 즉시 사용 가능
시세 조회 → 핀번호 입력 → 예상금액 계산 → 계좌 등록 → 상태 추적까지 실제 사용 흐름 전 단계 직접 검증
관리자 할인율 변경 → 사용자 화면 즉시 반영
상품권 종류별 할인율·마진율을 관리자가 변경하면 메인 시세 카드에 실시간 반영되는 구조 구현·확인
매입 신청 4단계 상태 실시간 조회
검증중·매입완료·이체완료·반려 4가지 상태 배지를 마이페이지에서 실시간 조회, 관리자 수동 변경 즉시 반영
관리자 일/주/월간 통계 Recharts 시각화
총 매입액·이체액·마진 3개 KPI + 추이 라인 차트를 기간 탭 전환으로 즉시 확인, 실DB 기반 집계 구현
10개 화면 정적 배포 전 화면 정상 동작
Next.js App Router 기반 10개 화면 정적 배포 후 사용자·관리자 분리 UI 전체 정상 동작 확인
핵심 기능
상품권 종류별 실시간 매입 시세 표시
5종 상품권 매입률·할인율을 메인 화면 카드로 표시. 관리자 변경 즉시 반영, 종류별 컬러 배지로 시각 구분
진행 단계
공고 분석 및 아키텍처 설계
2026.05.
요구사항 분석, 상품권 종류별 분기·이체 플로우·관리자 권한 포인트 식별, 기술 스택(Next.js 14+MongoDB+Recharts) 확정
프로젝트 상세
고객이 상품권 핀번호를 입력하면 유효성을 자동 검증하고 매입 대금을 즉시 이체하는 자동화 플랫폼 파일럿입니다. Next.js 14 App Router + MongoDB + Recharts 조합으로 PC웹·모바일웹·Android/iOS 패키징 앱 + 관리자 백오피스를 단일 코드베이스로 구현했습니다. [사용자 플로우] 상품권 5종(컬쳐랜드·구글·롯데모바일·스타벅스·해피머니) 실시간 시세 조회, 핀번호 입력
