이커머스/강의 플랫폼 구축하기
지금까지 배운 모든 기술을 하나로 꿰어 실제 수익을 창출하는 '완성형 플랫폼'을 구축합니다.
기획부터 결제 시스템까지, 실전 비즈니스의 전체 프로세스를 마스터해 보세요.
Step 1. 마스터 플랜 및 DB 설계
복잡한 플랫폼일수록 기초 설계가 중요합니다. 앞서 배운 PRD 작성법과 Prisma DB 설계를 활용하세요.
💡 핵심 포인트
- PRD 작성: 사용자와 관리자가 각각 어떤 기능을 사용할지 구체화
- Prisma 스키마: User, Product, Order, Category 간의 관계(Relation) 정의
- Migration:
npx prisma migrate dev로 실제 DB에 반영
Step 2. 회원 시스템 & 보안 (NextAuth v5)
사용자 경험의 시작은 로그인입니다. 소셜 로그인을 통해 이탈률을 낮추세요.
- Google, Kakao 등 주요 소셜 로그인 연동
- Middleware: 로그인하지 않은 사용자의 유료 강의/결제 페이지 접근 차단
- Session Management: 클라이언트와 서버 사이드에서 사용자 상태 관리
Step 3. 관리자 모듈 (Admin Dashboard)
플랫폼의 심장은 관리자 페이지입니다. 대시보드를 통해 비즈니스 현황을 한눈에 파악하세요.
- 통계 차트: 실시간 매출 및 신규 가입자 현황 시각화
- CRUD 구현: 상품 등록, 수정, 삭제 및 회원 등급 관리
- 이미지 호스팅: Imgur 등을 활용한 대용량 이미지/GIF 효율적 관리
Step 4. 결제 시스템 연동 (Payments)
가장 중요한 수익 창출 단계입니다. 직관적이고 신뢰감 있는 결제 UI를 구축하세요.
- Toss Payments, Payple 등을 활용한 연동
- 결제 상태 처리: 결제 대기, 완료, 취소 등 주문 상태 로직 구현
- 영수증/이메일: 결제 완료 후 사용자에게 알림 자동화 발송
Step 5. UI/UX 디테일 & 최적화
완성도를 결정짓는 것은 마지막 5%의 디테일입니다.
- SEO: 검색 엔진 최적화 및 카카오톡 썸네일 등록
- Performance: Next.js Image 컴포넌트와 폰트 호스팅으로 로딩 속도 단축
- Responsive: 모바일에서도 완벽하게 작동하는 반응형 레이아웃
Step 6. 온라인 강의 플랫폼 동영상 호스팅 (Vimeo)
온라인 강의 플랫폼에서 유료 콘텐츠인 동영상을 안전하게 보호하고 안정적으로 스트리밍하려면 전용 호스팅 서비스가 필수입니다. 보안과 가성비가 뛰어난 Vimeo(비메오)를 강력히 추천합니다.
🎥 왜 Vimeo인가요?
- 강력한 보안: 특정 도메인에서만 재생되도록 설정하여 동영상 무단 유출 방지
- 화질 최적화: 시청자의 인터넷 환경에 맞춰 자동으로 화질 조절 (Adaptive Streaming)
- 플레이어 커스텀: 로고 제거 및 브랜드 컬러 적용으로 전문성 있는 UI 구축
Vimeo 주요 요금제 (2025년 기준)
| 요금제 | 월 비용 (연간 결제 시) | 주요 기능 |
|---|---|---|
| Starter | 약 $12 / seat | 100GB 저장공간, 패스워드 보호, 기본 분석 |
| Standard | 약 $25 / seat | 2TB 저장공간, 로고 제거, 마케팅 도구, 도메인 제한 |
| Advanced | 약 $65 / seat | 7TB 저장공간, 웨비나/라이브 스트리밍, 대규모 이벤트 |
| Enterprise | 별도 문의 | 무제한 대역폭, 최고 수준의 보안 및 지원 |
※ 강의 플랫폼 구축 시에는 가성비가 좋은 Starter 요금제만으로도 충분합니다.
Step 7. 이커머스의 핵심: 주문-배송 프로세스 (Workflow)
단순한 결제를 넘어, 상품이 고객의 손에 닿기까지의 전 과정을 전문적으로 관리해야 합니다. 비즈니스의 신뢰도는 정교한 상태값(State) 관리에서 나옵니다.
주문 접수 및 대기
사용자가 결제창을 열었으나 아직 결제가 완료되지 않은 PENDING 상태입니다.
결제 완료 (배송 준비)
결제 대행(Payple 등)으로부터 성공 응답을 받아 DB를 PAID로 업데이트하고 재고를 차감합니다.
배송 중 / 처리
송장 번호를 입력하고 상태를 SHIPPING으로 변경합니다. 이때 카카오톡 알림톡(비즈메세지 API)을 통해 송장 번호가 자동 발송됩니다.
배송 완료 / 구매 확정
물품 도착 후 DELIVERED를 거쳐 COMPLETED가 되면 정산 및 포인트 적립이 이루어집니다.
🛠️ 설계 시 주의사항
- 알림 시스템: 배송 정보는 SMS보다 가독성이 좋고 저렴한 카카오 알림톡 연동을 추천합니다.
- 트랜잭션 이메일: 회원가입 인증, 결제 완료 메일 등은 국내 서비스보다 압도적으로 저렴하고 오토메이션 등 다양한 기능을 제공하는 Brevo 사용을 추천합니다.
- 웹후크(Webhook): 네트워크 오류로 결제 성공 응답을 놓치지 않도록 PG사의 웹후크를 반드시 구현하세요.
카카오톡 알림톡 파트너사 비교 (API 연동 가능)
| 파트너사 | 초기 단가 (1~9k건) | 10만+건 | 50만+건 | 특징 |
|---|---|---|---|---|
| 솔라피 | 13원 | 10원 → 8원 (38%↓) | 7원 → 6.5원 (50%↓) | Next.js SDK 최강, SMS 자동 폴백 |
| 비즈고 | 8원 고정 | 계약별 별도 협의 | 계약별 별도 협의 | 옴니 통합 API (Cafe24 최적), 폴백 강점 |
| DirectSend | 7.5원 고정 | 7.5원 | 7.5원 | REST API 초간단, 무할인 안정 |
| TasOn | 9원 (쿠폰가 6원) | 6원~ (33%↓) | - | Cafe24 내장 1위, 비개발자 쉬움 |
| NHN Cloud | 7.9원 | - | - | 대형몰 클라우드 안정성 최고 |
※ 카카오톡 알림톡 파트너사로 API 연동이 즉시 가능합니다.
글로벌 추천: Brevo (이메일)
| 플랜 | 가격 | 한도 |
|---|---|---|
| Free | $0 | 300건/일 |
| Starter | $9~ | 5,000건~/월 |
| Business | $18~ | 20,000건~/월 |
국내 API 가격 비교 (건당)
| 서비스 | 단가 | 특징 |
|---|---|---|
| TasOn | 0.45원 | Cafe24 연동 |
| DirectSend | 0.5원 | REST API |
| Mailnara | 0.5원 | 저가형 전용 |