Revideo SaaS Template

Revideo SaaS Template은 Midrender 팀이 공개한 프로덕션급 SaaS 스타터 킷이다. Next.js 14 + Fly Machines + Postgres + Stripe + S3 호환 스토리지를 한 번에 갖추고 있어 Revideo 기반 영상 SaaS를 하루 만에 배포할 수 있다.

🎯 이 템플릿이 풀어주는 문제

직접 만들 때的痛苦	SaaS Template
렌더 큐/워커 인프라 설계	Fly Machines 워커 풀 내장
사용자 인증	NextAuth (Google/GitHub) 내장
결제/구독	Stripe 연동 내장
파일 스토리지	S3 호환 (R2/Tigris) 설정만
사용량 측정·청구	API 호출/렌더 시간 메트릭
결과물 미리보기 UI	Studio 임베드 컴포넌트
환경 변수/dev/prod 분리	dotenv + Fly secrets 가이드

🏗️ 기술 스택

영역	선택	이유
프론트	Next.js 14 (App Router)	React + SSR + API Routes
인증	NextAuth v5	OAuth 다중 프로바이더
DB	Postgres (Fly Postgres)	사용자/영상 메타
결제	Stripe	구독 + 사용량 기반 과금
렌더 워커	Fly Machines	콜드 스타트 빠른 GPU 옵션
스토리지	S3 호환 (Tigris)	mp4 결과물
배포	Fly.io	한 명령 배포
스타일	Tailwind + shadcn/ui	빠르게 UI

🚀 Quick Start

git clone https://github.com/midrender/revideo.git
cd revideo/packages/saas-template
npm install
cp .env.example .env
# .env 수정: DATABASE_URL, STRIPE_*, S3_*, FLY_*
npm run dev

5분이면 dev 환경이 뜨고, npm run deploy 한 번으로 Fly.io 프로덕션 배포까지.

📂 디렉토리 구조

saas-template/
├── apps/
│   ├── web/              # Next.js 앱 (대시보드 + API)
│   │   ├── app/
│   │   │   ├── (marketing)/page.tsx   # 랜딩
│   │   │   ├── dashboard/             # 로그인 후 UI
│   │   │   └── api/                   # /api/render, /api/jobs
│   │   └── components/Player.tsx      # Revideo Player 임베드
│   └── worker/           # Fly Machines 워커 (renderVideo 호출)
├── packages/
│   ├── db/               # Drizzle ORM 스키마
│   └── ui/               # 공유 React 컴포넌트
├── project.ts            # Revideo makeProject 진입점
└── fly.toml              # Fly.io 배포 설정

🔌 핵심 API 라우트

라우트	메서드	역할
`/api/auth/[...nextauth]`	*	NextAuth 핸들러
`/api/render`	POST	`{variables}` 받아서 작업 enqueue, `{jobId}` 반환
`/api/jobs/:id`	GET	상태 조회 (`pending` / `rendering` / `completed` / `failed`)
`/api/jobs/:id/result`	GET	완료 시 mp4 스트리밍 또는 S3 서명 URL
`/api/stripe/webhook`	POST	결제 이벤트 처리

# 예: 영상 한 개 생성
curl -X POST https://your-app.fly.dev/api/render \
  -H "Content-Type: application/json" \
  -d '{"variables": {"userName": "김철수", "plan": "pro"}}'
# -> { "jobId": "clx1234..." }

# 상태 조회
curl https://your-app.fly.dev/api/jobs/clx1234
# -> { "status": "completed", "url": "https://..." }

⚙️ Fly Machines 워커 설정

fly.toml:

[[services.machines]]
  cpu_kind = "performance"
  cpus = 4
  memory_mb = 8192
  gpu_kind = "a10"  # 선택 — 비디오 인코딩 가속
  auto_start = true
  auto_stop = "off"  # 콜드 스타트 방지

GPU 머신은 NVENC 인코딩으로 4~8배 빠름
auto_stop = "off"로 항상 워밍 상태 유지
동시 처리량 늘리려면 머신 수 scale

💳 Stripe 사용량 기반 청구

packages/db/schema.ts:

// 사용자당 월 렌더 수 카운트
renderCount: integer('render_count').default(0)

// /api/render 핸들러 내부
const userLimit = await getPlanLimit(user.plan);
if (user.renderCount >= userLimit) {
  return res.status(402).json({error: 'plan limit reached'});
}
await db.incrementRenderCount(user.id);
await enqueueRenderJob({userId: user.id, variables});

Free / Pro / Enterprise 플랜별 한도 + Stripe webhook으로 자동 결제 갱신.

🛠️ 커스터마이즈 포인트

바꾸고 싶은 것	어디서
템플릿 영상 디자인	`project.ts` + `scenes/*`
변수 종류/스키마	`apps/web/lib/variables.ts`
가격/플랜	`apps/web/lib/billing.ts`
메일/알림	`apps/web/lib/email.ts`
도메인/브랜딩	`apps/web/app/(marketing)/*`

🆚 템플릿 vs 직접 만들기

	템플릿 사용	직접 조립
MVP 시간	1~3일	2~6주
유지보수	템플릿 업데이트 따라옴	자체
자유도	구조 안에서 커스텀	100% 자유
추천 대상	첫 SaaS, 빠른 출시	특수 인프라 요구

🚀 다음 단계

작업	가이드
직접 SaaS 설계	Revideo 렌더링 서비스 배포
공식 Render Endpoint (관리형)	Revideo 플랫폼 Render Endpoint
렌더 성능 튜닝	Revideo 성능 & 최적화

🔗 공식 리소스

공식 문서: https://midrender.com/revideo/docs/guide/building-webapps/saas-template
템플릿 GitHub: https://github.com/midrender/revideo/tree/main/packages/saas-template
Fly.io 가이드: https://fly.io/docs/machines/

상위 문서: ← Revideo 웹앱 & Player 출처: Revideo 공식 문서 — Revideo SaaS Template 한글화 (2026-07-29) 공급사: Revideo (현 Midrender)

변경 이력

날짜	변경
2026-07-29	초안 작성 — SaaS Template 아키텍처 + API/Fly/Stripe 핵심 설정