피드로 돌아가기
I built a full Fiverr clone with Next.js and Whop
Dev.toDev.to
Backend

Whop SDK 기반 Zero-Redirect 결제 및 KYC 통합 마켓플레이스 구축

I built a full Fiverr clone with Next.js and Whop

Doğukan Karakaş2026년 5월 7일10intermediate

Context

기존 마켓플레이스 구축 시 Stripe Connect, Persona 등 개별 솔루션 통합으로 인한 과도한 개발 공수와 복잡한 Compliance 프로세스가 주요 병목 지점으로 작용함. 특히 외부 도메인 리다이렉션으로 인한 사용자 경험 저하와 분산된 결제/인증 상태 관리의 어려움이 존재함.

Technical Solution

  • Whop SDK 기반의 Direct Charge 모델을 채택하여 플랫폼이 Merchant of Record가 되지 않는 구조로 설계함으로써 법적 책임 및 Compliance 오버헤드 제거
  • WhopCheckoutEmbed, VerifyElement 등 Embedded Components를 통한 In-app UX 구현으로 외부 리다이렉션 없는 Seamless한 결제 및 KYC flow 구축
  • Postgres Trigger를 통한 Database-enforced KYC Gate를 설계하여 인증되지 않은 판매자의 서비스 등록을 원천 차단하는 정합성 확보
  • Order Lifecycle State Machine을 정의하여 requirements → in_progress → delivered → completed로 이어지는 상태 전이를 API Route와 Role Check 기반으로 제어
  • Webhook 중심의 상태 동기화 구조를 설계하여 결제 및 KYC 완료 시점을 Database의 Single Source of Truth로 관리
  • Supabase RLS(Row Level Security)의 self/participant/admin 패턴을 적용하여 데이터 접근 권한을 세밀하게 제어

- 결제 및 인증 상태의 최종 결정권을 가지는 Webhook Handler를 최우선적으로 구현할 것 - 복잡한 비즈니스 프로세스는 UI 개발 전 상태 전이 행렬(State Transition Matrix)을 먼저 정의할 것 - 외부 SDK 도입 시 Production 환경 전 Sandbox 환경에서 API 권한 및 워크플로우를 완전히 검증할 것 - 연결 계정 생성 시 App API Key가 아닌 Company API Key를 사용하여 적절한 권한 계층을 유지할 것

원문 읽기