여러 판매자의 상품을 구매자 통화로 표시하고 결제 시점 환율로 청구액을 확정하며, 대금은 배송 완료까지 묶어 두었다가 판매자·플랫폼·배송사 몫으로 나눠 정산하고, 해외 배송 추적과 반품·분쟁 시 부담 주체를 규칙으로 판정하는 마켓플레이스
‘MVP 기획’·‘AI 빌드 기획 패키지’·‘프로토타입 프롬프트’는 빌드 패키지 하나에 함께 들어갑니다 — 따로 결제하지 않습니다.
어떻게 만드나?
AI 빌드 기획 패키지 · 베타 무료
AI 코딩 에이전트가 바로 투입할 정밀 스펙 + 붙여넣기 프롬프트.
Next.js (App Router) · Supabase Auth · Supabase (PostgreSQL) · Vercel
샘플은 여기까지 공개합니다
파일 다운로드와 전문(全文) 복사는 실제 결과물에서만 제공됩니다. 내 아이디어를 입력하면 같은 형식의 결과물을 받아볼 수 있습니다.
AI 코딩 에이전트(Cursor · v0 · Claude Code 등)에 아래 순서대로 붙여넣으면 됩니다. 각 단계를 끝내면 체크하세요.
AI 코딩 에이전트 준비
Cursor · v0 · Claude Code · Bolt 중 편한 도구를 열고 새 프로젝트를 시작하세요. 스택은 Next.js (App Router) · Supabase (PostgreSQL) (Next.js · Supabase · Vercel) 기준입니다.
프로젝트 셋업 — 환경변수 · 인증
필요한 환경변수
NEXT_PUBLIC_SUPABASE_URL NEXT_PUBLIC_SUPABASE_ANON_KEY SUPABASE_SERVICE_ROLE_KEY
# 인증 설정 — Supabase Auth (Google OAuth) 1. Supabase 프로젝트 생성 → Project Settings > API 에서 URL / anon / service_role 키 확보 2. Authentication > Providers > Google 활성화 (Google Cloud Console 에서 OAuth Client ID/Secret 발급해 입력) 3. Authentication > URL Configuration: Site URL + Redirect URLs(`https://<도메인>/**`) 4. 패키지: `@supabase/ssr`, `@supabase/supabase-js` 5. 서버/클라이언트 Supabase client 분리. service_role 키는 서버 전용(브라우저 노출 금지). 6. App Router 미들웨어로 세션 갱신.
전체 골격 만들기 — 마스터 프롬프트 실행
아래 프롬프트를 통째로 복사해 에이전트에 붙여넣으면 프로젝트 뼈대가 만들어집니다.
[역할] 당신은 시니어 엔지니어이며, AI 코딩 에이전트를 통해 빠르고 안전하게 크로스보더 이커머스 마켓플레이스 MVP를 빌드하는 역할입니다. 비개발자도 숙련된 빌드 결과를 얻을 수 있어야 합니다. [제품 요약] - 국내 소상공인이 해외 구매자에게 상품을 판매할 수 있게 지원하는 웹 기반 이커머스 플랫폼. - 핵심 기능: 상품등록/목록/상세, 구매, 결제, 배송 추적, 정산, 분쟁 처리 (최소 핵심 로직만). - 메인 유저: 해외 판매를 시작하려는 국내 판매자, 해외 구매자, 정산·분쟁을 처리하는 운영자. …
모듈 구현 — 프로젝트 및 환경 기본 세팅
앞 단계 결과 위에서 이 프롬프트를 실행해 기능을 채웁니다.
1. Next.js (App Router)로 새 프로젝트를 생성하고, Vercel에 배포 가능한 환경을 만듭니다. 2. Supabase 프로젝트를 생성하고 연결(환경변수는 .env.local로 관리, 코드에 하드코딩 금지)합니다. 3. Supabase JS 클라이언트 설치 및 기본 세팅. 4. 서버 Action(Next.js server component 또는 api route) 환경에서만 Supabase 서비스 키를 사용하도록 안전하게 구성합니다. …
모듈 구현 — 인증 시스템 (Supabase Auth)
앞 단계 결과 위에서 이 프롬프트를 실행해 기능을 채웁니다.
1. Supabase Auth를 이용한 Email/password 기반 회원가입 및 로그인, 로그아웃 UI 및 로직을 구현합니다. 2. roles: 판매자/구매자/운영자(관리자) 세 가지를 회원가입 순서에 할당할 수 있도록 UI 및 DB에 반영합니다. 3. 클라이언트와 서버에서 사용자 인증 토큰/세션 검증 및 role 체크 예시 코드를 포함해 설명합니다. 4. 인증/인가 우회 및 서비스 키 노출이 없도록 주의합니다. …
모듈 구현 — DB 스키마 생성 (Supabase PostgreSQL)
앞 단계 결과 위에서 이 프롬프트를 실행해 기능을 채웁니다.
1. users, products, orders, shipments, payments, settlements, disputes 테이블을 요구 스키마에 따라 Supabase SQL로 생성하는 쿼리문을 작성해 주세요. 2. 각 테이블의 필수 컬럼, 제약조건, 기본 PK/FK, role/rules 예시도 포함해주세요. 3. Supabase 정책(RLS, 보안규칙)에서 쓰기/수정/삭제는 인증된 사용자만 가능하도록 최소 권한 정책 예제도 포함해 주세요. …
모듈 구현 — 핵심 기능 구현 (상품, 주문, 결제, 배송, 정산, 분쟁 처리)
앞 단계 결과 위에서 이 프롬프트를 실행해 기능을 채웁니다.
1. 상품 목록 노출/상세 페이지, 주문 및 결제 입력 폼, 주문 내역과 배송 상태(쉽먼트) 조회 화면 UI/서버로 분리해서 작성합니다. 2. 판매자 상품 등록/수정, 구매자 주문/결제 처리, 구매자 주문/배송 조회, 운영자 정산/분쟁 관리 각각에 대해 server actions/api route 사용 예시를 제시합니다. 3. 결제 및 정산, 분쟁 로직은 최소 MVP 수준의 단순화된 예시로 작성합니다. (실시간 환율, 복잡 정산/분쟁 X, 사전 고정 환율 등) 4. 클라이언트에서 서버 액션 호출 후 권한 체크, 데이터 무결성, 서버 액션에서 DB 및 Supabase 연동 예제를 포함합니다. …
모듈 구현 — 관리자 도구 및 최소 배포 세팅
앞 단계 결과 위에서 이 프롬프트를 실행해 기능을 채웁니다.
1. 운영자(관리자) 권한으로 대금 정산 관리(orders/payments/settlements), 분쟁 관리(disputes), 사용자(role 포함) 관리 기능을 위한 최소 UI 및 서버 action 예제를 작성합니다. 2. Vercel에 배포할 때 필수 환경변수, Supabase URL/Key, 인증 정보 보안 처리 유의사항을 정리합니다. 3. 최초 배포용 README.md 샘플도 포함해 주세요. …
배포하기
# 배포 — Vercel
1. Vercel 에 GitHub 저장소 Import (Framework Preset = Next.js)
2. 환경변수(NEXT_PUBLIC_SUPABASE_URL / ANON_KEY / SUPABASE_SERVICE_ROLE_KEY) 등록
3. `vercel.json` 에 `{ "framework": "nextjs" }` 명시(권장)
4. main 푸시 시 자동 배포. 배포 후 Supabase Redirect URLs 에 운영 도메인 추가.검증 — 핵심 시나리오 테스트
아래 체크리스트로 핵심 기능이 동작하는지 확인하세요.
# 수용 테스트 체크리스트 회원 - [ ] 회원가입: 이메일/비밀번호/역할로 신규 가입 성공(중복 불가) - [ ] 로그인: 정확한 정보로 성공 및 잘못된 정보 시 실패 - [ ] 인증 필요 API(주문, 결제 등)는 미로그인시 401 반환 - [ ] 역할별 데이터 범위 다름 (구매자는 내 주문만, 판매자는 내 상품/주문만) 상품 - [ ] 상품 목록/상세: 비회원 포함 누구나 전체 상품 조회 가능 - [ ] 상품 등록/수정: 판매자만 허용, 잘못된 요청은 403 주문/결제 - [ ] 구매자가 상품 주문 생성 및 해당 통화/가격 고정 - [ ] 결제 등록: 주문 후 결제 처리, 한 주문당 1번만 (중복금지) 배송/조회 - [ ] 판매자만 배송정보 입력 가능 - [ ] 구매자/판매자가 각자 관련 주문의 배송상태 확인 가능, 다른 사용자는 접근불가 정산 - [ ] 정산 관리(운영자): 주문/결제별로 대금 분배 처리 가능, 계좌/정산액 등 출력 - [ ] 운영자가 아닌 경우 정산 API 접근 시 403 분쟁 - [ ] 구매자/판매자가 각자의 주문에 대해 분쟁 등록 가능 - [ ] 운영자가 burden_party/resolution_status 확정하여 판정 가능 - [ ] 분쟁문의 없는 주문엔 분쟁 조회 결과 없음 공통/보안 - [ ] POST/변경 API는 서버에서만 허용(클라에 Secret 없는지 점검) - [ ] 웹 배포환경(Vercel 등)에서 env 누락시 즉시 에러 발생 및 확인 가능
막혔을 때 — 트러블슈팅
에이전트가 에러로 막히면 아래 대응을 참고하세요.
# 자주 막히는 문제 & 해법 1. 증상: 모든 API 호출이 401 Unauthorized 발생 → 원인: Supabase Auth 세션 쿠키 미설정/잘못된 Supabase URL 키 → 해결: ① 올바른 supabaseUrl/supabaseKey를 .env에 반드시 입력 ② API 라우트/서버액션 내에 supabase.auth.getUser()/getSession() 활용 ③ 클라이언트에서 인증된 요청만 보내는지 확인 2. 증상: 빌드/배포 후 env 변수 관련 에러로 기능 작동 안함 → 원인: .env.local 파일 누락, Vercel 환경변수 설정 미이행 → 해결: 로컬은 .env.local에, Vercel은 Project Settings>Environment Variables에서 supabase, 결제, secret키 정확 입력 후 리빌드 3. 증상: POST/PUT 등 데이터 변경 API로 직접 요청시 403 또는 db 에러 → 원인: Supabase RLS(행레벨 보안)이 안맞거나 정책 미설정 → 해결: ① 테이블별로 row-level 보안 활성화 및 owner 검증 정책 명확히 세팅 ② 서버 액션에서 user id/role 확인 후 insert/update 4. 증상: 배포 후 브라우저에서 시크릿(secret) 노출 경고 또는 노출 → 원인: 환경변수/시크릿을 클라 코드나 브라우저로 내보냄 → 해결: server actions/route handlers에서만 시크릿 참조, 클라이언트로는 일부만 전달(불필요 전송 금지) 5. 증상: 주문/정산/배송 등 관련 데이터가 꼬임 혹은 다른 사용자에 노출 → 원인: RLS 정책 미흡, API내 권한체크 누락, 데이터 쿼리 범위 넓음 → 해결: 모든 SELECT/UPDATE/DELETE에서 user id/role로 where 조건 강제, 테스트/QA로 role별 접근권리 검증
막히거나 시간이 없다면? 전문가가 이 빌드킷 그대로 제작해드립니다.
전문가에게 맡기기 →국내 소상공인이 해외 소비자에게 상품을 쉽게 판매할 수 있도록, 결제·배송·정산·분쟁처리의 복잡성을 플랫폼이 기본적으로 해결해주는 최소기능의 웹 기반 글로벌 마켓플레이스입니다.
상품 등록 및 목록 표시
판매자는 상품을 등록하고, 구매자는 그 목록과 상세를 볼 수 있습니다.
주문/결제
구매자가 상품을 장바구니에 담고, 수량/주소 입력 후 주문 및 결제할 수 있습니다.
배송상태 연동 및 주문내역 조회
구매자는 주문한 상품의 배송상태를 트래킹넘버로 조회할 수 있고, 판매자도 확인할 수 있습니다.
대금 정산 로직 및 현황 관리
플랫폼 운영자는 각 주문의 대금을 판매자, 플랫폼 수수료로 나누어 정산상태를 관리할 수 있습니다.
기초 분쟁/반품 처리 및 책임 배분
분쟁 또는 반품 발생 시, 어느 쪽(판매자/구매자/플랫폼)이 어떤 부담을 지게 되는지 시스템에서 기본 판정하고 처리할 수 있습니다.
backend/schema.sql
샘플에서는 일부만 표시-- 확장 및 기본 함수
CREATE EXTENSION IF NOT EXISTS pgcrypto; -- UUID 생성 등
-- 사용자 정보
CREATE TABLE users (
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
role TEXT NOT NULL CHECK(role IN ('seller','buyer','admin')),
email TEXT UNIQUE NOT NULL,나머지 99줄은 실제 결과물에서 확인할 수 있습니다
backend/rls.sql
샘플에서는 일부만 표시-- RLS(행 수준 보안) 활성화 및 예시 정책 -- ⚠️ 운영 적용 전 반드시 충분히 검증해야 함 ALTER TABLE users ENABLE ROW LEVEL SECURITY; ALTER TABLE products ENABLE ROW LEVEL SECURITY; ALTER TABLE orders ENABLE ROW LEVEL SECURITY; ALTER TABLE shipments ENABLE ROW LEVEL SECURITY; ALTER TABLE payments ENABLE ROW LEVEL SECURITY;
나머지 26줄은 실제 결과물에서 확인할 수 있습니다
backend/seed.sql
샘플에서는 일부만 표시-- 예시 데이터: 판매자/구매자/운영자, 상품, 주문, 결제, 배송, 정산, 분쟁
INSERT INTO users (id, role, email, password_hash) VALUES
('00000000-0000-0000-0000-000000000001','seller','seller@example.com','hash1'),
('00000000-0000-0000-0000-000000000002','buyer','buyer@example.com','hash2'),
('00000000-0000-0000-0000-0000000000aa','admin','admin@example.com','hasha');
INSERT INTO products (id, seller_id, name, description, price_usd) VALUES나머지 16줄은 실제 결과물에서 확인할 수 있습니다
frontend/tailwind.config.js
샘플에서는 일부만 표시module.exports = {
content: [
'./app/**/*.{js,ts,jsx,tsx}',
'./components/**/*.{js,ts,jsx,tsx}'
],
theme: {
extend: {},
},나머지 2줄은 실제 결과물에서 확인할 수 있습니다
frontend/app/layout.tsx
샘플에서는 일부만 표시"use client";
import "../globals.css";
import { ReactNode } from "react";
export default function RootLayout({
children,
}: { children: ReactNode }) {
return (나머지 10줄은 실제 결과물에서 확인할 수 있습니다
frontend/components/Button.tsx
샘플에서는 일부만 표시import { ButtonHTMLAttributes } from 'react';
export function Button(props: ButtonHTMLAttributes<HTMLButtonElement>) {
return <button className="px-4 py-2 font-medium text-white bg-blue-600 hover:bg-blue-700 rounded disabled:opacity-50" {...props} />;
}frontend/app/products/page.tsx
샘플에서는 일부만 표시'use client';
// 상품 목록 (데모형, 확장 가능)
import { Button } from '../../components/Button';
// 실제 서비스에서는 서버/DB 연동 필요
const products = [
{
id: '10000000-0000-0000-0000-000000000001',나머지 29줄은 실제 결과물에서 확인할 수 있습니다
frontend/globals.css
샘플에서는 일부만 표시@tailwind base; @tailwind components; @tailwind utilities;
M0. 프로젝트 초기화 및 기본 구조 세팅
세부 태스크 3개
M1. DB 모델 설계 및 시드
세부 태스크 3개
M2. 기본 API와 서버 컴포넌트 통합
세부 태스크 3개
M3. 운영자 정산/분쟁처리 등 핵심 로직 적용
세부 태스크 2개
[역할] 당신은 시니어 엔지니어이며, AI 코딩 에이전트를 통해 빠르고 안전하게 크로스보더 이커머스 마켓플레이스 MVP를 빌드하는 역할입니다. 비개발자도 숙련된 빌드 결과를 얻을 수 있어야 합니다. [제품 요약] - 국내 소상공인이 해외 구매자에게 상품을 판매할 수 있게 지원하는 웹 기반 이커머스 플랫폼. - 핵심 기능: 상품등록/목록/상세, 구매, 결제, 배송 추적, 정산, 분쟁 처리 (최소 핵심 로직만). - 메인 유저: 해외 판매를 시작하려는 국내 판매자, 해외 구매자, 정산·분쟁을 처리하는 운영자. [필수 스택]
나머지 54줄은 실제 결과물에서 확인할 수 있습니다
프로젝트 및 환경 기본 세팅
샘플에서는 일부만 표시1. Next.js (App Router)로 새 프로젝트를 생성하고, Vercel에 배포 가능한 환경을 만듭니다. 2. Supabase 프로젝트를 생성하고 연결(환경변수는 .env.local로 관리, 코드에 하드코딩 금지)합니다. 3. Supabase JS 클라이언트 설치 및 기본 세팅. 4. 서버 Action(Next.js server component 또는 api route) 환경에서만 Supabase 서비스 키를 사용하도록 안전하게 구성합니다. 5. 기본적인 ESLint/Prettier 환경 세팅 포함.
나머지 2줄은 실제 결과물에서 확인할 수 있습니다
인증 시스템 (Supabase Auth)
샘플에서는 일부만 표시1. Supabase Auth를 이용한 Email/password 기반 회원가입 및 로그인, 로그아웃 UI 및 로직을 구현합니다. 2. roles: 판매자/구매자/운영자(관리자) 세 가지를 회원가입 순서에 할당할 수 있도록 UI 및 DB에 반영합니다. 3. 클라이언트와 서버에서 사용자 인증 토큰/세션 검증 및 role 체크 예시 코드를 포함해 설명합니다. 4. 인증/인가 우회 및 서비스 키 노출이 없도록 주의합니다.
나머지 1줄은 실제 결과물에서 확인할 수 있습니다
DB 스키마 생성 (Supabase PostgreSQL)
샘플에서는 일부만 표시1. users, products, orders, shipments, payments, settlements, disputes 테이블을 요구 스키마에 따라 Supabase SQL로 생성하는 쿼리문을 작성해 주세요. 2. 각 테이블의 필수 컬럼, 제약조건, 기본 PK/FK, role/rules 예시도 포함해주세요. 3. Supabase 정책(RLS, 보안규칙)에서 쓰기/수정/삭제는 인증된 사용자만 가능하도록 최소 권한 정책 예제도 포함해 주세요. 구체적인 SQL 및 정책 예시만 명확하게 작성해 주세요.
핵심 기능 구현 (상품, 주문, 결제, 배송, 정산, 분쟁 처리)
샘플에서는 일부만 표시1. 상품 목록 노출/상세 페이지, 주문 및 결제 입력 폼, 주문 내역과 배송 상태(쉽먼트) 조회 화면 UI/서버로 분리해서 작성합니다. 2. 판매자 상품 등록/수정, 구매자 주문/결제 처리, 구매자 주문/배송 조회, 운영자 정산/분쟁 관리 각각에 대해 server actions/api route 사용 예시를 제시합니다. 3. 결제 및 정산, 분쟁 로직은 최소 MVP 수준의 단순화된 예시로 작성합니다. (실시간 환율, 복잡 정산/분쟁 X, 사전 고정 환율 등) 4. 클라이언트에서 서버 액션 호출 후 권한 체크, 데이터 무결성, 서버 액션에서 DB 및 Supabase 연동 예제를 포함합니다.
나머지 1줄은 실제 결과물에서 확인할 수 있습니다
관리자 도구 및 최소 배포 세팅
샘플에서는 일부만 표시1. 운영자(관리자) 권한으로 대금 정산 관리(orders/payments/settlements), 분쟁 관리(disputes), 사용자(role 포함) 관리 기능을 위한 최소 UI 및 서버 action 예제를 작성합니다. 2. Vercel에 배포할 때 필수 환경변수, Supabase URL/Key, 인증 정보 보안 처리 유의사항을 정리합니다. 3. 최초 배포용 README.md 샘플도 포함해 주세요. 실제 코드, 환경설정, 문서 샘플을 간결히 제시해 주세요.