Bolt.new로 AI 풀스택 앱 만들기

기초약 20분4단계

브라우저 안에서 AI가 프론트엔드+백엔드+DB까지 한 번에 만들어줘요. 코딩 없이도 실제 동작하는 앱을 배포까지 할 수 있어요.

따라 하기

1단계 / 4

Bolt.new 접속 및 앱 설명 입력

  1. bolt.new에 접속합니다(별도 가입 없이 시작 가능, GitHub 로그인 권장). 채팅창에 만들고 싶은 앱을 구체적으로 설명합니다.
  2. ›'레시피 저장·검색 앱, 재료 태그 필터, 즐겨찾기 기능, React + Tailwind'처럼 기능과 스택을 함께 명시하세요.
Bolt.new 열기

이해를 돕는 예시 그림이에요. 실제 화면과 다를 수 있어요.

bolt.new
Bolt 실제 화면
실제 화면

팁 기술 스택을 지정하지 않아도 Bolt.new가 자동으로 선택합니다. Vite+React+Tailwind가 기본이며, Next.js로 해줘, Vue.js 사용 등으로 변경 가능합니다.

처음이라 잘 모르겠다면

bolt.new에서 사용자 인증·게시물 작성·좋아요 기능이 있는 SNS 앱 만들어줘처럼 원하는 앱을 설명하세요.

막히면 볼 것

자주 하는 실수 3가지
  1. 1DB 없이 localStorage만 사용 → 다른 기기에서 데이터 공유 불가 — 실제 서비스는 Supabase 등 백엔드 연동 필요
  2. 2무료 플랜 토큰 소진 후 중단 — 핵심 기능 먼저 완성 후 세부 수정하는 순서로 작업
  3. 3생성 코드 검토 없이 배포 → 보안 취약점 가능성 — API 키·비밀번호 하드코딩 여부 반드시 확인
AI 없이 할 때와 뭐가 다른가요?

앱 아이디어 설명 → AI 자동 빌드 → 30분 내 배포 가능

간단한 할일 관리 앱 만들려는데 프론트·백엔드·DB 다 따로 설정해야 해서 엄두가 안 나...
나
풀스택 환경 설정만 며칠 걸릴 수 있습니다.지금까지