VibeStart바이브코딩의 첫걸음
AI로 코딩하고 싶은데
어디서부터 시작하지?
개발 도구 설치가 어려워서 포기하셨나요? VibeStart가 하나하나 안내해드릴게요.
✓ 완전 무료✓ 10분이면 끝✓ 코딩 경험 불필요
이미 환경 설치 끝났어요? 내 사이트 만들기 →
my-portfolio.vercel.app
Portfolio
AboutWorkContact
Full-Stack Developer
Hi, I'm Minjun
I build beautiful web experiences with modern tools.
View Projects
Contact Me
E-commerce App
Next.js · Stripe · Tailwind
AI Chat Bot
React · OpenAI · Vercel
VibeStart를 따라하면 이런 사이트를 직접 만들 수 있어요
어떻게 진행되나요?
1
간단한 질문
OS와 만들고 싶은 것만 알려주세요
2
맞춤 안내
필요한 도구를 단계별로 알려드려요
3
복사 & 붙여넣기
명령어를 복사해서 실행하면 끝!
직접 하기 vs VibeStart
혼자 하면...
- ✗"Git 설치" 검색 → 블로그마다 방법이 다름
- ✗Node.js 버전 뭘 깔아야 하는지 모름
- ✗환경변수 PATH가 뭔지 모름
- ✗에러 나면 어디서 막혔는지 모름
VibeStart로 하면
- ✓OS에 맞는 명령어가 바로 나옴
- ✓검증된 최신 LTS 버전을 자동 안내
- ✓명령어 복사 한 번이면 PATH 설정 완료
- ✓단계별 진행이라 어디서 막혔는지 바로 알 수 있음
환경 세팅 후에는?
설치가 끝나면 이런 것도 단계별로 안내해드려요
🚀
내 사이트 배포
GitHub + Vercel로 인터넷에 공개
🔐
로그인 기능
Google 로그인 버튼 추가
🤖
바이브코딩
AI에게 말해서 사이트 수정
자주 묻는 질문
바이브코딩이 뭔가요?+
코드를 직접 쓰는 대신 AI에게 자연어로 요청해서 프로그램을 만드는 방식입니다. 예를 들어 "로그인 페이지 만들어줘"라고 말하면 AI가 코드를 생성합니다.
코딩을 전혀 모르는데 할 수 있나요?+
네, VibeStart는 코딩 경험이 전혀 없는 분을 위해 만들었습니다. 터미널에 명령어를 복사해서 붙여넣기만 하면 되고, 각 단계마다 왜 하는지도 함께 안내합니다.
Git, Node.js, VS Code가 뭔가요? 왜 필요한가요?+
Git은 코드 변경 기록을 관리하는 도구, Node.js는 웹 앱을 실행하는 엔진, VS Code는 코드를 편집하는 프로그램입니다. AI 코딩 도구(Cursor, Claude Code)가 이 세 가지 위에서 동작하기 때문에 먼저 설치해야 합니다.
Windows와 macOS 둘 다 지원하나요?+
네, OS를 선택하면 해당 환경에 맞는 명령어가 자동으로 나옵니다. Windows는 PowerShell, macOS는 Terminal 기준으로 안내합니다.
정말 무료인가요?+
네, VibeStart의 환경 세팅 가이드는 완전 무료입니다. 설치하는 도구(Git, Node.js, VS Code)도 모두 무료이고, 별도 결제나 회원가입 없이 바로 시작할 수 있습니다.
얼마나 걸리나요?+
인터넷 속도에 따라 다르지만, 보통 10~15분이면 모든 도구 설치와 첫 프로젝트 생성까지 완료됩니다.
설치 중에 에러가 나면 어떻게 하나요?+
각 단계가 독립적이라 어디서 막혔는지 바로 알 수 있습니다. 에러 메시지를 AI 도구(ChatGPT, Claude 등)에 붙여넣으면 대부분 해결 방법을 알려줍니다. 블로그에도 자주 발생하는 에러 해결 가이드가 있습니다.
환경 세팅 후에는 뭘 하면 되나요?+
VibeStart Phase 2에서 GitHub에 코드를 올리고, Vercel로 인터넷에 배포하고, Google 로그인 기능을 추가하는 것까지 단계별로 안내합니다. AI 도구로 사이트를 수정하는 바이브코딩 루프도 체험할 수 있습니다.
지금 바로 시작해보세요
설치할 게 없어요. 브라우저에서 바로 시작합니다.
코딩 경험이 전혀 없어도 괜찮아요. 천천히 따라오시면 됩니다.