Skip to content
VibeStartVibeStart介绍博客
返回列表

Bolt.new에서 본인 Next.js 프로젝트로 졸업하는 시점 — 5가지 신호와 마이그레이션 체크리스트 (2026)

Bolt.new로 30분에 prototype 만든 후 어디서 본인 Next.js로 옮겨야 하나. Performance·custom backend·auth·team collab·cost 5가지 졸업 신호와 GitHub export부터 Vercel 배포·env 이전·CI 셋업까지 마이그레이션 체크리스트.

Bolt.newNext.js App RouterVercel 배포WebContainerAI 코딩 워크플로production migrationSupabase AuthAI prototypeAI 앱 빌더developer workflow

🤔 Bolt prototype 만든 후 진짜 질문

Bolt.new로 30분에 작동하는 prototype을 만든 직후 가장 자주 나오는 질문이 있다. "이대로 production 가도 되나, 아니면 본인 프로젝트로 옮겨야 하나." 답은 "지금 어떤 신호가 보이는지에 따라 다르다"이다. 너무 일찍 옮기면 Bolt가 아끼게 해줄 시간을 본인 셋업으로 다 써버리고, 너무 늦게 옮기면 Bolt의 한계에 갇혀서 매월 토큰 비용만 늘어난다.

이 글은 graduation 시점을 정량적으로 판단할 5가지 신호와 신호가 들어왔을 때 진행할 마이그레이션 체크리스트를 정리한다. WP 짝꿍 Bolt.new 완벽 가이드 (비전공자용) 글이 "어떻게 처음 시작하나"를 다룬다면, 이 글은 "어디서 졸업하나"를 다룬다. v0 출력을 production으로 옮기는 흐름은 v0 → production Next.js 통합 6단계 글에서 다룬 적이 있는데, Bolt는 통합보다 "전체 프로젝트 이전"의 결정이라 다른 프레임이 필요하다.

📋 5가지 졸업 신호

#신호왜 graduate해야 하나
1Performance: LCP 3초 초과WebContainer 한계로 실 production build보다 무거움
2Custom backend 필요실 DB 연결·queue·cron이 Bolt sandbox에 안 들어감
3Auth 복잡도 증가OAuth provider·custom session·SSO가 Bolt 기본을 넘음
4Team collaboration여러 dev가 같은 프로젝트 브랜치·PR 워크플로 필요
5월 토큰 비용 $50+프로젝트 커지면 토큰 비용 급증, 자체 호스팅이 저렴

5개 중 1개라도 명확하게 보이면 graduate 시점이다. 2개 이상 동시면 즉시 진행. 0개면 Bolt에 머물러도 OK — graduate가 미덕이 아니라 적시가 미덕이다.

🔍 신호 1 — Performance: LCP 3초 초과

Bolt는 WebContainer라는 브라우저 안 Node.js 환경에서 작동한다. 빠른 prototype은 강하지만 실제 사용자에게 servign되는 production 환경과는 다르다. 본인 prototype URL을 PageSpeed Insights에 넣어서 LCP가 3초를 넘으면 graduate 신호다. 본인 Next.js + Vercel로 옮기면 Edge Network·CDN·자동 image optimization이 들어가서 평균 LCP 1-2초로 떨어진다. 트래픽이 100명 이상 매일 들어오기 시작하면 이 차이가 SEO·conversion에 직접 영향을 준다.

🔧 신호 2 — Custom backend 필요

Bolt는 frontend 중심 빌더라 데이터베이스·백그라운드 작업·webhook 같은 backend 필요가 커지면 한계가 명확하다. Supabase Auth·Stripe webhook·AWS S3 업로드·cron job·queue 같은 게 들어오면 Bolt 안에서 풀려고 시도하지 말고 본인 프로젝트로 옮겨야 한다. Vercel Functions + Supabase 조합이 사실상 표준이고, 마이그레이션 체크리스트의 4단계가 이 셋업이다.

🔐 신호 3 — Auth 복잡도 증가

Bolt에 들어있는 기본 auth는 데모용으로 충분하지만 OAuth provider 3개 이상, custom session storage, SSO, role-based access control 같은 게 들어오면 Bolt 안에서 구현하기 어렵다. NextAuth.js 또는 Supabase Auth 같은 본격 솔루션은 본인 Next.js 프로젝트에서 표준 패턴으로 굳어 있어서 graduate 후에 통합이 빠르다.

👥 신호 4 — Team collaboration

본인 혼자 작업할 때 Bolt는 빠르지만 팀이 들어오는 순간 한계가 명확하다. 여러 dev가 동시에 같은 프로젝트를 수정하려면 Git branch·PR 리뷰·CI 워크플로가 필요한데 Bolt는 single-session 도구라 collab이 약하다. 두 번째 dev가 들어오는 시점이 graduate 시점이다. GitHub 기반 표준 워크플로로 옮기는 게 5분 후 효과를 보여준다.

💰 신호 5 — 월 토큰 비용 $50+

Bolt Pro는 $25/월 10M 토큰이지만 프로젝트 사이즈가 커지면 한 번 prompt에 1-2M 토큰이 쉽게 나가서 월 한도를 빠르게 채운다. 매월 $50을 넘기 시작하면 Vercel Hobby (무료) + 본인 IDE (Cursor 무료 또는 $20) 조합이 더 저렴하다. 비용 계산식: Bolt 월 비용 - (Vercel 비용 + 본인 dev 시간 비용) > 0이면 graduate.

🛠 마이그레이션 체크리스트 (8단계)

신호가 보이면 즉시 진행. 평균 1-2시간이면 끝난다.

1. Bolt에서 GitHub export

Bolt UI 우측 상단 → Connect to GitHub → 새 저장소 생성 또는 기존 저장소 연결. Bolt가 자동으로 commit history 만들어 push한다. export 직후 commit hash 메모해두면 롤백 시점 만들기 쉽다.

# 로컬에서 clone
git clone https://github.com/your-org/your-bolt-project.git
cd your-bolt-project
pnpm install

2. Environment 변수 이전

Bolt secrets는 export에 안 들어가니 본인이 수동으로 옮긴다.

# .env.local 생성
cp .env.example .env.local
# Bolt → Settings → Secrets에서 한 줄씩 복사

Vercel 배포할 때는 Project Settings → Environment Variables에 동일하게 등록한다.

3. Dependency audit

Bolt가 자동 추가한 패키지 중 본인 프로젝트에 안 맞는 게 있다.

# 사용 안 하는 패키지 찾기
pnpm dlx depcheck

# Bolt 전용 패키지 제거 (보통 @bolt 접두사)
pnpm remove @bolt/runtime @bolt/devtools

4. Backend 셋업

신호 2 (custom backend) 또는 신호 3 (auth)이 graduate 이유면 이 단계가 핵심이다.

# Supabase 프로젝트 생성 (db + auth)
pnpm dlx supabase init
pnpm dlx supabase link --project-ref your-project-ref

# Vercel Functions 셋업
mkdir -p app/api
# route handlers 생성

기존 Bolt에서 mock data로 작동했던 부분을 실 DB 연결로 바꾼다.

5. TypeScript strict 모드

Bolt 출력은 implicit types가 많다. tsconfig.json에서 strict: true 활성화 후 type error 잡기. 평균 5-15개 error가 나오는데 한 번에 정리하면 다음에 쌓이지 않는다.

6. Vercel 배포

pnpm dlx vercel
# 프로젝트 연결, 배포 확인

배포 URL 받으면 PageSpeed Insights로 LCP·CLS 측정. Bolt URL 측정값과 비교해 개선 확인.

7. CI 셋업

GitHub Actions 또는 Vercel built-in으로 PR마다 preview deploy + test 자동 실행. 5분 셋업.

# .github/workflows/ci.yml
name: CI
on: [pull_request]
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: pnpm/action-setup@v3
      - run: pnpm install
      - run: pnpm typecheck
      - run: pnpm lint
      - run: pnpm test

8. Custom domain 연결

Vercel Project → Settings → Domains에 본인 도메인 추가. DNS A record 또는 CNAME 설정 후 5-15분이면 SSL 자동 발급.

⚠️ 너무 일찍 졸업하면 일어나는 일

prototype validation 안 끝났는데 graduate하면 5가지 손실이 있다. 첫째, 본인 셋업 시간 1-2시간을 제품 검증보다 인프라에 쓴다. 둘째, validation pivot이 일어나면 셋업한 인프라가 무용지물이 된다. 셋째, Bolt의 빠른 iteration 속도를 잃는다. 넷째, 5가지 신호 중 0개인데 graduate하면 본인 prod 인프라가 prototype보다 무겁고 느려진다. 다섯째, 본인 코드 quality가 prototype 단계에서 너무 일찍 굳어 나중에 다시 갈아엎게 된다.

기준: validation 끝났는가 (하루 5명 이상 사용자가 prototype 사용) + 5가지 신호 중 1개 이상 명확. 두 조건 모두 만족 시 graduate.

⚖️ Graduate 안 하는 게 더 나은 경우

1. Demo/showcase 프로젝트: 본인 포트폴리오나 발표 demo는 평생 Bolt에 머물러도 OK. 트래픽 안 받고 비용도 작다.

2. Internal tool (5명 이하 사용): 사내용 작은 도구는 Bolt 안에서 충분히 production-ready. graduate 비용이 효과보다 큼.

3. 1-week sprint hackathon: 1주 안에 작동만 보여주면 되는 프로젝트는 Bolt가 ROI 최강.

4. Validation 0건: 사용자 5명도 안 써본 prototype은 graduate 전에 validation부터.

🧩 마이그레이션 흔한 실수 4가지

실수 1 — Git history 잃음. Bolt → GitHub export 시 first commit이 모든 변경을 한 번에 묶어서 들어가는 경우가 있다. Bolt 안에서 commit history 보존 옵션을 활성화하지 않으면 발생. export 전에 Settings → Git 옵션 확인.

실수 2 — env 변수 빼먹기. Bolt secrets 중 build-time variable과 runtime variable 둘 다 있는데 본인이 한쪽만 옮기면 production 배포 시 build 실패 또는 runtime crash. 모든 secret을 한 번에 옮기시고 .env.example에 키 이름만 commit.

실수 3 — Bolt-specific dependency 그대로 둠. @bolt/* 패키지는 WebContainer 안에서만 작동한다. Vercel 배포 시 build error로 잡혀서 시간 낭비. Step 3 dependency audit을 빠뜨리지 말 것.

실수 4 — DB schema 마이그레이션 미준비. Bolt 안에서 만든 mock DB schema를 실 Supabase로 옮길 때 1:1 카피 안 됨. 보통 Bolt mock은 nullable·관계 제약 없이 만들어지는데 실 prod에서는 NOT NULL·foreign key 필요. Supabase migration 파일 먼저 작성한 후 데이터 옮길 것.

면책조항: 이 글은 2026년 5월 기준 Bolt.new v2, Next.js 16, Vercel CLI 53.x, Supabase JS 3.x 기준으로 작성됐습니다. Bolt의 export 기능, 토큰 가격, WebContainer 한계는 매월 업데이트되니 graduate 결정 전 Bolt 공식 문서로 최신 정보를 확인하시기 바랍니다. 본 글의 5가지 신호와 8단계 체크리스트는 일반적 graduation 패턴이며 모든 프로젝트에 동일하게 적용되지 않습니다.

여기까지 읽어주셔서 감사드려요. Bolt는 prototype 단계의 강력한 도구지만 graduate 시점을 놓치면 결정 비용이 훨씬 커집니다. 5가지 신호 중 1개 이상이 보이는 시점에 1-2시간만 투자해서 본인 Next.js + Vercel 인프라로 옮기시면 그 후 모든 작업의 ROI가 올라가요.

❓ 자주 묻는 질문

Q. 5가지 신호 중 어느 것이 가장 빨리 오나요?

대부분 신호 5(월 토큰 비용 $50+)가 가장 빨리 옵니다. 작은 prototype도 한 번 큰 refactor를 시키면 1-2M 토큰이 한 번에 나가서 월 한도를 한 주 만에 채울 수 있어요. 그 다음으로 신호 2(custom backend)가 일찍 오는 편입니다.

Q. Bolt에서 직접 production 배포는 못 하나요?

기본 plan에서는 안 됩니다. Bolt는 prototype과 sharing용으로 설계됐어요. Custom domain 연결과 production-grade hosting을 위해서는 Vercel·Netlify 같은 표준 호스팅으로 옮겨야 합니다.

Q. graduate 후 Bolt를 계속 써도 되나요?

권장합니다. graduate 후에도 새 기능 prototype은 Bolt에서 빠르게 만들고, 검증되면 본인 Next.js 프로젝트에 통합하는 hybrid 흐름이 가장 효율적이에요. v0와 비슷한 패턴으로 쓰시면 됩니다.

Q. 1-2시간 graduate 시간이 부족한 비전공자는 어떻게 하나요?

graduation 시점이 왔는데 본인이 직접 마이그레이션 어려우시면 freelancer 1-2시간 의뢰가 합리적입니다. Vercel·Supabase 셋업 표준 작업이라 시급 $50-100 수준에서 처리됩니다. 비용은 Bolt 두 달 토큰 비용이면 충당 가능.

Q. 마이그레이션 후 Bolt 프로젝트는 삭제해도 되나요?

GitHub export 확인 후 1-2주는 두는 걸 권장합니다. 마이그레이션 중 빠뜨린 게 발견되면 Bolt에서 다시 확인할 수 있어요. 1-2주 안정화 확인 후 삭제하시면 됩니다.

Q. Supabase 대신 다른 backend 써도 되나요?

Vercel Postgres, PlanetScale, Neon, Convex, Firebase 등 모두 가능합니다. Supabase가 Auth + DB가 한 곳에 묶여있어 비전공자에게 가장 친화적이라 본 글에서 기본 추천했지만, 본인 도메인에 맞는 걸로 고르시면 됩니다.

Q. Bolt에서 만든 디자인을 graduate 후 어떻게 유지하나요?

Bolt가 출력하는 React + Tailwind CSS 코드가 본인 Next.js 프로젝트에서 그대로 작동합니다. 다만 design token이 본인 프로젝트의 shadcn/ui 또는 본인 디자인 시스템과 다르면 token alignment가 필요한데, 이 패턴은 v0 → production Next.js 통합 6단계 글의 3단계와 동일합니다.

Q. graduate 신호가 1개 보이는데 다른 신호가 안 보이면 어떻게 하나요?

1개만 명확해도 graduate 진행하시는 걸 권장합니다. 5개 모두 보일 때까지 기다리면 보통 신호 5(비용)가 폭발해서 결정 비용이 더 큽니다. 1개 보이는 시점이 가장 매끄러운 graduation 시점이에요.

🔗 관련 글

📚 참고 자료