AI 도구 목록으로
Vercel
v0
텍스트로 React 컴포넌트를 만들어 주는 AI. 디자인·프로토타입 빠르게.
🟢 무료 플랜 있음한국어 OK심화
v0 공식 사이트로 이 도구가 필요한 사람
프론트엔드 개발자·디자이너·기획자. shadcn/ui·Tailwind 익숙한 분.
뭘 할 수 있는지
- 자연어 → React + Tailwind 컴포넌트
- shadcn/ui 기반 — 본인 프로젝트에 바로 사용
- 이미지 → 코드 (디자인 mockup → 구현)
- Vercel 통합
무료 vs 유료 차이
무료
- ·월 200 크레딧
- ·기본 컴포넌트 생성
유료
- ·Premium $20 — 더 많은 크레딧·고급 모델
- ·팀 옵션
초보자가 막히는 지점
- 1shadcn/ui·Tailwind 안 쓰는 프로젝트는 통합이 번거로움
- 2복잡한 비즈니스 로직은 직접 작성 필요
- 3디자인 시스템이 일정해서 차별화 어려움
실제 업무 활용 예시
랜딩 페이지
'30대 재테크 SaaS 랜딩, 푸른 톤' → 5초에 첫 안.
관리자 대시보드
'사용자 목록·필터·상세 모달' → 코드까지 한 번에.
디자인 → 코드
Figma 시안 스크린샷 업로드 → 비슷한 React 코드.
대체 도구 비교
- Lovable비슷한 컨셉, v0 가 React 친화
- Bolt.new풀스택 자동, v0 는 컴포넌트 중심
- 상세 →Cursor코드 에디터, v0 는 디자인 우선
추천 프롬프트 2개
1. 랜딩 페이지▾
30대 직장인 대상 [제품] 랜딩, hero·기능 3개·후기·CTA 구조. 푸른 톤·shadcn/ui.
2. 관리자 UI▾
사용자 목록 테이블 + 필터(이름·상태) + 상세 모달. shadcn/ui 패턴.