막혔을 때 보는 바이브코딩 가이드
첫 앱을 아직 안 만들었다면 30분 시작 가이드부터 보세요. 이 글은 이미 한 번 시켜봤는데 이상해졌을 때를 위한 글입니다.
1. 바이브코딩이란?
바이브코딩은 실용적이고 효율적인 개발 방법론입니다. 복잡한 이론보다는 실전에서 바로 활용할 수 있는 코드와 패턴을 중심으로 학습하고 개발하는 접근 방식입니다.
2. 화면이 이상할 때
처음부터 다시 시키지 마세요. 지금 보이는 것만 고치게 말하세요.
이렇게 말하세요
지금은 계산 기능은 그대로 두고, 버튼만 더 크게 해주세요.
모바일에서도 글자가 잘리니까 여백을 늘려주세요.
다른 파일은 만들지 마세요.3. 에러가 났을 때
- 빨간 글씨나 콘솔 메시지를 그대로 복사합니다.
- “이 에러만 고치고, 다른 기능은 건드리지 마”라고 붙입니다.
- 고친 뒤 “뭐가 잘못됐는지 두 줄로 설명해줘”라고 한 번 더 묻습니다.
팁: 에러를 숨기고 처음부터 다시 만들면, 같은 실수가 반복됩니다.
에러를 붙여넣는 사람이 더 빨리 늘습니다.
4. 파일이 너무 많아졌을 때
초보는 index.html 하나로 충분합니다.
AI가 css, js, 컴포넌트를 잔뜩 만들면 이렇게 말하세요.
파일을 더 나누지 말고, 지금 동작을 index.html 하나로 합쳐주세요.
초보가 브라우저에서 이 파일만 열면 되게 해주세요.5. 두 번째 기능 붙이는 법
첫 화면이 된 다음에만 기능을 하나 더 넣습니다.
- 목록 지우기 버튼
- 어제 기록 남기기
- 큰 글씨 모드
한 번에 세 개를 시키지 마세요. 하나가 되면 다음 하나를 시킵니다. 이게 바이브코딩의 전부입니다.
6. 이 사이트에서 배울 점
바이브 플랫폼의 계산기들은 “입력 → 계산 → 결과”가 분명합니다. 초보 프로젝트도 이 세 덩어리만 있으면 됩니다.