Production starter

요청사항만 얹어서 바로 제작하는 기본 앱 골격

프론트엔드, 백엔드, 배포 서버를 Next.js/Vercel 기준으로 먼저 고정하고 DB, 인증, AI, worker는 옵션 adapter로 붙입니다.

제작 틀 보기 API 골격 확인

Default build frame

작업 시작 전에 고정해둘 세 개의 레이어

애니메이션 반응형 화면

Frontend shell

대부분의 웹 제작 요청은 1~5페이지 안에서 끝나므로 섹션 기반 레이아웃, 모바일 우선 구조, CSS 애니메이션 훅을 기본값으로 둡니다.

Hero + trust + offer + proof + CTA
Server Component 우선
폼/토글/미리보기만 Client Component
Playwright 화면 smoke

Route Handler + Repository

Backend shell

Next.js app/api 아래에 리소스형 route handler를 만들고, 비즈니스 로직은 repository 인터페이스 뒤로 숨깁니다.

GET/POST/PATCH 기본
입력 검증 함수
표준 JSON 응답
로컬 fixture adapter

Vercel 기본 배포

Server shell

커스텀 서버 없이 Vercel 배포를 기본으로 두고, DB/스토리지/AI/worker는 환경변수와 adapter로만 켭니다.

Vercel Node runtime
Supabase optional
R2/AI/Worker optional
env 계약 문서화

실제 백엔드 골격

`app/api/starter/projects`는 목록, 생성, 상태 변경까지 동작합니다. 고객 프로젝트에서는 이 route를 복제해 leads, products, drafts 같은 리소스로 바꿉니다.

POST /api/starter/projects
{
  "name": "로컬 병원 홈페이지",
  "service": "website",
  "target": "반응형 소개 + 예약 CTA",
  "pages": ["홈", "진료안내", "의료진", "오시는 길", "문의"],
  "needsDb": true,
  "needsAuth": false,
  "needsAi": false
}

서버 환경 계약

`GET /api/starter/health`로 Vercel/Supabase/AI 상태 확인
`STARTER_DATA_ADAPTER=local`이면 fixture/in-memory adapter 사용
`STARTER_DATA_ADAPTER=supabase`는 Supabase adapter 교체 후 사용
커스텀 Express 서버 없이 Vercel Route Handler 사용

Project console seed

처음 복제하면 들어있는 제작 보드

websitedraft

로컬 매장 홈페이지 스타터

반응형 랜딩 + 문의 전환

홈
소개
서비스
사례
문의

commercereview

상품 검수 콘솔 스타터

CSV 인입 + 검수 + export

대시보드
상품 인입
검수 큐
마켓 미리보기
내보내기

contentapprove

콘텐츠 초안 큐 스타터

초안 생성 + 검수 + 승인 후 내보내기

키워드 큐
초안
검수
캘린더
발행 보조

제작 운영 가이드라인

고객별 민감정보는 fixture, 문서, 테스트에 넣지 않는다.
첫 버전은 DB 없이 로컬 fixture와 in-memory adapter로 데모한다.
DB가 필요하면 Supabase adapter만 교체하고 화면/서비스 로직은 유지한다.
AI/worker는 승인 전 자동 publish가 아니라 draft/review/approve 뒤에 붙인다.
웹페이지는 섹션 기반 반응형 + 가벼운 CSS animation을 기본값으로 둔다.
Vercel 배포는 기본, 별도 서버는 장기 작업 worker가 필요할 때만 둔다.

복제할 파일 지도

app/starter/page.tsx - 제작 스타터 화면
app/api/starter/projects/route.ts - 프로젝트 생성/목록/상태 변경 API
app/api/starter/health/route.ts - Vercel/Supabase/AI 환경 상태 API
lib/starter/repository.ts - local 또는 Supabase adapter 선택
lib/starter/local-repository.ts - DB 없는 기본 저장소
lib/starter/supabase-repository.ts - Supabase 연결 자리
docs/production-starter.md - 요청별 제작 가이드라인