바이브코딩이란? 뜻·하는 법·문제점, 바이브코더 시작법까지 24번 해 봤어요

바이브코딩(바이브 코딩, vibe coding)은 코드를 직접 쓰지 않고, 만들고 싶은 것을 AI 에게 말로 설명해 프로그램을 만드는 방법이에요. 코딩을 몰라도 작은 앱은 돼요. "할 일 목록 웹앱 만들어 줘"라는 같은 부탁을 AI 4개에 3번씩 해 봤더니 12번 모두 제대로 돌아가는 앱이 나왔어요. 한 번에 6~18초, 7~50원이었어요. 이 글은 바이브코딩 뜻, 하는 법 5단계, 만들 수 있는 것, 문제점, 만든 앱을 올리는 곳까지 다뤄요. 툴 10곳의 요금·무료 범위 비교는 바이브코딩 툴 추천 글에 따로 정리했어요.

글쓴이 서순명(솔리드그루 이사, futureinfra.ai) · 운영사 솔리드그루(사업자등록번호 875-44-00335) · 문의 support@futureinfra.ai · 02-6933-6229 · 실험 2026년 10월 1일 서울 · 배포 서비스 가격 확인 2026년 10월 26일 · 마지막 확인 2026년 11월 3일(공식 문서 링크·퓨쳐인프라 요금) · 이해관계를 밝혀 둬요. 퓨쳐인프라는 솔리드그루가 운영하는 서비스로, AI 라우터·앱 호스팅·교육을 팔아요. 다른 회사 도구는 공식 페이지만 확인했어요 · 개인정보처리방침 · 이용약관

바이브코딩이 뭐예요?

바이브(vibe)는 "느낌·분위기"라는 뜻이에요. 코드 한 줄 한 줄을 따지지 않고, 원하는 느낌을 말로 전하면 AI 가 코드를 써 줘요. 사람은 결과를 눌러 보고 "여기 고쳐 줘"라고 다시 말해요.

이 말은 2025년 2월 안드레이 카파시가 X(옛 트위터) 글에서 처음 썼어요. 카파시는 오픈AI 공동 창업자이고 테슬라에서 AI 를 이끌었던 사람이에요. 같은 해 11월 콜린스 영어 사전은 "vibe coding"을 2025년 올해의 단어로 뽑았어요(위키백과).

노코드와는 뭐가 달라요?

노코드는 정해진 블록을 끌어다 놓아 앱을 만드는 도구예요. 블록에 없는 기능은 만들기 어려워요. 바이브코딩은 AI 가 진짜 코드를 써요. 그래서 할 수 있는 범위가 넓고, 만든 코드를 내 것으로 가져갈 수 있어요. 대신 코드가 맞는지 확인하는 일은 사람 몫으로 남아요.

쉽게 말하면 노코드는 레고 세트, 바이브코딩은 목수에게 말로 주문하는 거예요. 목수는 뭐든 만들어 주지만, 다 만든 뒤 문이 잘 닫히는지는 내가 열어 봐야 해요.

바이브코더는 누구고, 무엇을 잘해야 해요?

바이브코더는 바이브코딩으로 무언가를 만드는 사람이에요. 개발자일 수도 있고, 코딩을 한 번도 안 해 본 기획자·사장님·학생일 수도 있어요. 하는 일은 셋이에요. 만들 것을 말로 설명하고, 결과를 눌러 보고, 고칠 점을 다시 말해요.

개발자와 다른 점은 코드 문법보다 "무엇을 확인할지"에 힘을 쓴다는 거예요. 그래서 아래 실험도 코드를 읽지 않고, 버튼을 눌러 보는 방식으로 확인했어요. 바이브코더가 실제로 하는 일과 같아요.

바이브코더에게 필요한 힘 5가지

이 글의 실험을 하면서 결과를 가른 건 코딩 실력이 아니었어요. 아래 다섯 가지였어요.

바이브코더는 현장 감독에 가까워요. 벽돌을 직접 쌓지는 않지만, 도면을 주고 다 지은 집의 문과 창을 하나하나 열어 봐요.

정말 말만으로 돼요? AI 4개에 같은 부탁을 해 봤어요

직접 해 봤어요. 코딩을 모르는 사람이 칠 법한 부탁 한 문장을 AI 4개에 똑같이 보냈어요. 모델마다 3번씩, 모두 12번이에요.

할 일 목록 웹앱을 HTML 파일 하나로 만들어 줘. 할 일을 추가하고, 완료 체크하고, 삭제할 수 있어야 해. 새로고침해도 목록이 남아 있게 해 줘. 다른 파일이나 외부 라이브러리 없이 코드만 보내 줘.

받은 코드는 손대지 않고 todo.html 로 저장했어요. 파일을 더블클릭하면 크롬에서 바로 열려요. 사람이 하는 순서대로 눌러 본 화면이에요(Claude Sonnet 5.5 1회차).

12개 앱 모두를 이렇게 손으로 누르면 실수가 생겨요. 그래서 크롬을 자동으로 움직여 같은 순서로 눌러 보며 아래 7가지를 확인했어요. 기준은 먼저 정해 두었어요.

// 판정 코드 핵심(Node.js + Playwright, 실제로 돌린 judge.mjs 에서 줄임)
await page.goto(fileUrl);                        // ① 열기 — pageerror 가 0건이면 통과
for (const t of ["우유 사기", "책 읽기", "운동 30분"]) {
  await input.fill(t); await input.press("Enter"); // ② 추가(안 되면 '추가' 버튼)
}
await row("우유 사기").check();                   // ③ 체크 전후 상태(checked·줄긋기)가 바뀌나
await row("책 읽기").deleteButton.click();         // ④ 화면에서 사라지나
await page.reload();                             // ⑤ 추가·완료·삭제가 그대로인가
await input.fill("   "); await input.press("Enter"); // ⑥ 개수가 그대로인가
await add('<img src=x onerror="window.__x=1">');  // ⑦ window.__x 가 생기지 않나

결과는 12개 모두 ①~⑤를 통과했어요. 빈칸 막기와 태그 안전(⑥⑦)까지 통과한 앱도 12개였어요. 판정기가 엉터리가 아닌지 보려고, 일부러 허술하게 짠 앱도 넣어 봤어요. 그 앱은 ⑤⑥⑦에서 떨어졌어요.

이 판정에도 한계가 있어요. 자동으로 누르는 방식이라 디자인이 예쁜지, 휴대폰에서 쓰기 편한지는 보지 않았어요. 저장은 모두 브라우저 안(localStorage)이라, 다른 기기나 다른 브라우저에서는 목록이 따로 놀아요.

생김새는 조금씩 달라요. GPT-5.6 Terra 는 새 할 일을 맨 위에 붙였고, 나머지는 아래에 붙였어요. Sonnet·DeepSeek 은 "남은 할 일 2개" 같은 숫자를 알아서 넣었어요. 완료한 일을 한꺼번에 지우는 버튼도 더했어요. 부탁하지 않은 기능도 AI 가 덧붙인다는 뜻이에요.

고쳐 달라고 하면 잘 고쳐요?

바이브코딩은 한 번에 끝나지 않아요. 써 보고 고쳐 달라는 일이 대부분이에요. 그래서 같은 대화를 이어 한 번 더 부탁했어요.

좋아. 여기에 할 일마다 마감일을 넣을 수 있게 해 줘. 마감일이 지난 할 일은 빨간 글씨로 보여 주고, 목록은 마감일이 가까운 순서로 정렬해 줘. 고친 전체 코드를 다시 보내 줘.

마감일이 2020년(지난 일)·2030년·2099년인 할 일을 일부러 순서를 섞어 넣었어요. 그리고 네 가지를 봤어요. 날짜 칸이 생겼나, 지난 일이 빨간 글씨인가, 가까운 순서로 줄을 섰나, 새로고침해도 그대로인가예요. 12개 중 11개가 모두 맞았어요.

틀린 하나는 DeepSeek 3회차였어요. 할 일 이름은 검은 글씨 그대로고, 그 밑의 날짜 줄만 빨갛게 바꿨어요. "빨간 글씨"를 어디까지로 볼지 AI 가 좁게 읽은 거예요. 이럴 땐 "할 일 이름까지 빨갛게"라고 한 번 더 말하면 돼요.

하나 더 있어요. Gemini 1회차는 마감일을 꼭 넣어야만 추가되게 바꿨어요. 마감일 없는 할 일은 못 넣게 된 거예요. 부탁에 없던 규칙이 생길 수 있으니, 고친 뒤에는 원래 되던 기능도 다시 눌러 보세요.

얼마나 걸리고 얼마 들어요?

처음 만들기는 9.1~15.1초 걸렸어요. 고쳐 달라기는 코드 전체를 다시 쓰느라 16.1~33.3초였어요. 돈은 모델 값 차이가 그대로 보였어요. 넷 중 가장 싼 DeepSeek 은 11원, 가장 비싼 쪽도 44원이었어요.

이 정도 앱은 어느 모델이든 됐어요. 차이는 값과 디자인 취향이었어요. 앱이 커지면(로그인·결제·여러 화면) 모델 차이가 더 크게 날 수 있어요. 이번 실험은 작은 앱 하나만 잰 결과예요.

바이브코딩으로 뭘 만들 수 있어요? 예시

이번 실험의 할 일 앱처럼 화면 하나에 기능 몇 개인 것은 코딩을 몰라도 한 번에 나와요. 저장할 곳이 생기고, 돈이나 개인정보가 오가면 확인할 게 늘어나요. 처음에는 아래 표의 윗줄부터 해 보세요.

가게에 빗대면 ①은 종이 한 장짜리 전단지, ②는 손님 명단을 적는 노트가 붙은 가게, ④는 금고가 있는 가게예요. 금고를 다루는 가게는 혼자 열기 전에 전문가에게 한 번 보여 주세요.

처음 만들 거리는 "매주 손으로 하는 귀찮은 일"에서 찾으면 좋아요. 쓸 사람이 나라서 확인도 쉬워요. 만든 앱을 남에게 보여 주려면 아래 "어디에 올려요?"를 보세요.

바이브코딩 도구와 AI 모델은 뭘 골라요?

위 실험은 AI 에게 직접 부탁하는 가장 간단한 방법이었어요. 실제로는 바이브코딩을 돕는 도구를 많이 써요. 도구는 쓰는 방식에 따라 세 갈래예요. 내 상황에 맞는 갈래부터 고르세요.

VS Code 로도 바이브코딩 돼요?

돼요. VS Code 같은 코드 편집기에 AI 확장을 깔면 편집기형이 돼요. 클로드 코드도 VS Code 확장으로 쓸 수 있어요(공식 문서). AI 가 바꾼 줄이 편집기에 그대로 보여서, 코드를 조금씩 배우고 싶은 사람에게 맞아요. 처음부터 화면만 보고 싶다면 설치가 없는 브라우저형이 더 쉬워요.

컴퓨터(노트북)는 얼마나 좋아야 해요?

대부분 비싼 컴퓨터가 필요 없어요. 브라우저형은 인터넷과 브라우저만 있으면 돼요. AI 는 회사 서버에서 돌고, 내 컴퓨터는 글과 결과만 주고받아요. 에이전트형인 클로드 코드의 공식 요구 사항도 메모리(RAM) 4GB 이상, macOS 13 이상·Windows 10(1809) 이상·Ubuntu 20.04 이상, 인터넷 연결이에요(설치 문서, 2026-11-03 확인).

사양이 크게 필요한 건 AI 모델을 내 컴퓨터에서 직접 돌릴 때(로컬 LLM)예요. 이때는 그래픽카드 메모리가 넉넉해야 해요. 처음 배울 때는 권하지 않아요. 같은 일을 클라우드 모델로 하면 이 글 실험처럼 한 번에 몇십 원이에요.

AI 모델은 뭐가 좋아요? 실험 숫자로 보면

작은 앱이면 어느 모델이든 됐어요. 그래서 처음엔 싼 모델로 여러 번 고쳐 보고, 고칠 곳이 많아지면 말을 정확히 따르는 모델로 바꾸는 방법이 돈이 덜 들어요. 이 표는 10월 1일 실험 기준이에요. 모델은 자주 새로 나오니, 같은 부탁 한 문장을 새 모델에 넣어 직접 비교해 보세요.

무료로는 어디까지 돼요?

만들기는 거의 무료로 돼요. 러버블·볼트·커서는 무료로 시작할 수 있어요(한도 있음). AI 에 직접 부탁하면 이번 실험 기준 한 번에 7~89원이었어요. 올리기도 HTML 한 장이면 무료 정적 호스팅으로 돼요. 돈이 드는 때는 로그인·데이터베이스가 붙거나, 도구의 무료 한도를 넘길 때예요.

바이브코딩 하는 법 5단계(처음이라면)

이 글 실험에서 쓴 순서 그대로예요. 도구가 달라도 순서는 같아요.

부탁(프롬프트)은 어떻게 써요?

이번 실험에서 잘 된 이유는 부탁에 확인할 기준이 다 들어 있었기 때문이에요. "추가·완료·삭제·새로고침해도 남게"처럼 눌러 보면 맞는지 알 수 있는 말로 쓰세요. "예쁘게", "알아서"만 쓰면 AI 마다 다른 걸 만들어요.

요구사항 한 장(PRD)부터 쓰면 덜 헤매요

PRD 는 "무엇을 만들지 적은 문서"예요. 회사에서는 길게 쓰지만, 바이브코딩에서는 네 칸이면 돼요. 이번 실험의 부탁도 이 네 칸으로 나누면 아래와 같아요. 복사해서 칸만 바꿔 쓰세요.

[만들 것] 할 일 목록 웹앱. HTML 파일 하나.
[꼭 되는 기능] 추가 · 완료 체크 · 삭제 · 새로고침해도 남기
[확인 기준] 빈칸은 추가되지 않는다 · 태그를 넣어도 글자로만 보인다
[안 해도 되는 것] 로그인 · 디자인 꾸미기 · 외부 라이브러리

"안 해도 되는 것" 칸이 생각보다 중요해요. 이번 실험에서 AI 는 부탁하지 않은 버튼과 규칙을 덧붙였어요. 빼고 싶은 것을 미리 적으면 이런 일이 줄어요.

CLAUDE.md·AGENTS.md 같은 규칙 파일은 뭐예요?

대화할 때마다 같은 말을 되풀이하지 않게 프로젝트 폴더에 두는 안내문이에요. 클로드 코드는 CLAUDE.md 를 세션마다 읽어요(공식 문서). AGENTS.md 는 여러 코딩 에이전트가 함께 읽도록 만든 공개 형식이에요(agents.md). 위 "요구사항 한 장"이 이번 앱 하나의 주문서라면, 규칙 파일은 프로젝트 전체의 약속이에요.

# CLAUDE.md 예시(짧을수록 잘 지켜요)
- 이 프로젝트는 HTML 파일 하나로 된 할 일 앱이에요.
- 외부 라이브러리를 쓰지 말아 주세요.
- 고친 뒤에는 추가·완료·삭제·새로고침을 다시 확인해 주세요.
- 비밀번호·API 키는 코드에 넣지 말아 주세요.

규칙은 "눌러 보면 지켜졌는지 알 수 있는 말"로 쓰세요. "깔끔하게"보다 "외부 라이브러리 없이"가 잘 지켜져요.

바이브코딩으로 만든 앱, 어디에 올려요? 배포 서비스 비교

AI 가 만든 todo.html 은 내 컴퓨터에서만 열려요. 친구 휴대폰에서도 열리게 하려면 인터넷 주소가 있는 곳에 올려야 해요. 이걸 배포라고 해요. 어디에 올릴지는 앱 모양으로 정하면 돼요.

서비스별 무료 범위와 값(2026년 10월 26일 공식 페이지)

값은 각 회사 공식 가격 페이지 그대로예요. 달러 값은 세금이 따로 붙을 수 있고, 환율과 카드 해외 결제 수수료도 생각하세요. 표에 없는 GitHub Pages·Cloudflare Pages 는 정적 사이트를 무료로 올려 줘요. 기본 주소와 조건은 무료 도메인 글에 정리했어요.

러버블·볼트처럼 자기 주소에 바로 올려 주는 도구도 있어요. 다른 도구로 만들었거나, 내 도메인·데이터베이스가 필요하면 호스팅을 따로 써요. 퓨쳐인프라 앱 호스팅은 도커 이미지를 올리면 주소와 HTTPS(자물쇠 표시)가 같이 붙어요. 도커 이미지는 앱과 실행에 필요한 것을 한 상자에 담은 파일이에요. 클로드 코드 같은 에이전트에게 "도커 이미지로 만들어 줘"라고 부탁하면 돼요.

쓰지 않을 때 앱을 정지하면 실행 요금(월 5,000원 몫)이 멈춰요. 자리 값 500원과 저장 공간 값은 지울 때까지 붙어요. 앱을 하나라도 쓰는 달에는 최소 3,300원이 나가요. 도커 이미지를 만드는 법과 다른 곳 값 비교는 도커 호스팅 비용 비교 글에 있어요.

바이브코딩의 현실과 문제점, 어디서 막혀요?

이번 할 일 앱은 모두 잘 됐지만, 늘 그렇진 않아요. 바이브코딩의 문제점은 크게 넷이에요. ① AI 가 말을 다르게 알아듣고 ② 앱이 커질수록 고치기가 길어지고 ③ 데이터가 어디 있는지 모르기 쉽고 ④ 보안 확인이 사람 몫으로 남아요. 실험에서 실제로 본 막힘부터 적을게요.

앱이 커지면 고칠 때마다 코드 전체를 다시 받게 돼요. 이번 실험에서도 고쳐 달라기는 처음 만들기보다 1.5~2.2배 오래 걸렸어요. 돈도 같이 늘어요. 같은 모델에서 고쳐 달라기 값은 처음 만들기의 약 1.6~2배였어요(Claude 42원 → 83원, DeepSeek 11원 → 20원). 파일이 여러 개로 늘면 브라우저형 도구보다 파일을 직접 다루는 편집기형·에이전트형이 편해져요.

개발자에게 맡기는 것과 비교하면요?

작은 내부용 도구·시제품은 바이브코딩이 빨라요. 반나절이면 눌러 볼 수 있는 화면이 나와요. 손님 돈이 오가거나 개인정보를 많이 다루는 서비스는 달라요. 보안 점검과 오류 대응을 해 줄 사람이 있어야 해요. 그래서 "직접 만들어 보고, 서비스로 키울 때 전문가에게 점검받는" 순서를 많이 써요.

코드를 하나도 모르면 문제가 생겼을 때 어디를 고쳐 달라고 할지 막막해요. 그래서 "무엇을 확인할지"를 먼저 정하는 습관이 코딩 문법보다 중요해요. AI 에게 "이 코드에서 보안상 위험한 부분을 찾아 줘"라고 따로 물어보는 것도 방법이에요.

바이브코딩은 어디서 배울 수 있어요?

혼자 배운다면 공식 문서의 빠른 시작이 가장 정확해요. 화면 이름과 명령이 바뀌면 공식 문서가 먼저 고쳐지기 때문이에요. 클로드 코드는 한국어 빠른 시작 문서가 있어요. 이 글의 5단계를 먼저 해 보고, 막히는 곳을 문서에서 찾으면 덜 헤매요.

혼자 해 보다 막히면 함께 해 보는 자리가 빨라요. 퓨쳐인프라 바이브코딩 교육은 각자 만들고 싶은 서비스를 가져와서 해요. 화면을 만들고, 실제 주소로 배포하는 데까지 함께 해 봐요. 문법은 외우지 않고, 신청할 때 적은 내 아이디어로 실습해요.

자주 묻는 질문

바이브코딩 뜻이 뭐예요?

코드를 직접 쓰지 않고 AI 에게 말로 설명해 프로그램을 만드는 방법이에요. 2025년 2월 안드레이 카파시가 처음 쓴 말이에요.

바이브코딩은 영어로 어떻게 써요?

vibe coding 이에요. 우리말로는 "바이브코딩"과 "바이브 코딩"을 섞어 써요. 같은 말이에요.

코딩을 몰라도 바이브코딩을 할 수 있나요?

작은 앱은 돼요. 할 일 목록 앱을 AI 4개에 3번씩 부탁했더니 12번 모두 제대로 동작했어요. 다만 결과를 눌러 보고 확인하는 일은 사람이 해야 해요.

바이브코딩은 무료로 할 수 있나요?

러버블·볼트·커서는 무료로 시작할 수 있어요(한도 있음). AI 에 직접 부탁하면 한 번에 몇십 원이에요. 이번 실험에서는 한 번에 7~89원이 들었어요.

바이브코더가 뭐예요?

바이브코딩으로 무언가를 만드는 사람이에요. 코드 대신 말로 설명하고, 결과를 눌러 보고, 고칠 점을 다시 말해요. 그래서 코딩 문법보다 무엇을 확인할지 정하는 힘을 더 많이 써요.

바이브코딩 도구는 뭐가 좋아요?

코딩이 처음이면 브라우저형(러버블·볼트), 코드를 보며 배우려면 편집기형(커서·VS Code + AI 확장), 큰 일을 맡기려면 에이전트형(클로드 코드)이 맞아요. 툴 10곳의 요금과 무료 범위는 바이브코딩 툴 추천 글에 있어요.

바이브코딩에 좋은 노트북 사양이 따로 있어요?

없어도 돼요. 브라우저형은 브라우저만 있으면 되고, 클로드 코드도 공식 요구 사항이 메모리 4GB 이상이에요. 사양이 필요한 건 AI 모델을 내 컴퓨터에서 직접 돌릴 때예요.

CLAUDE.md 는 뭐예요?

클로드 코드가 세션마다 읽는 프로젝트 안내문이에요. "외부 라이브러리 없이", "고친 뒤 다시 확인"처럼 매번 할 말을 적어 둬요. 여러 에이전트가 함께 읽는 형식으로는 AGENTS.md 가 있어요.

바이브코딩에서 말하는 MVP 는 무슨 뜻이에요?

꼭 필요한 기능만 넣은 첫 판(최소 기능 제품)이에요. 이 글 실험의 "추가·완료·삭제·새로고침해도 남기" 네 가지가 할 일 앱의 MVP 예요. 먼저 MVP 를 만들고 하나씩 더하면 덜 헤매요.

바이브코딩으로 만든 앱은 어디에 올려요?

HTML 한 장이면 GitHub Pages·Netlify·Vercel 같은 정적 호스팅에 무료로 올려요. Vercel 무료는 비상업 용도만이에요. 로그인·DB 가 있으면 앱 호스팅을 써요. 퓨쳐인프라 앱은 월 5,500원(부가세 포함), 카페24 AI SPACE 는 월 4,900원부터, Railway 는 월 $5부터예요(2026-10-26).

바이브코딩으로 만든 앱은 안전한가요?

확인이 필요해요. 비밀번호·키를 코드에 넣지 말고, 남이 입력한 글이 코드로 실행되지 않는지 시험해 보세요.

이 글의 숫자는 어디서 왔나요?

회차별 원자료(부록)