1. 대상 독자와 선수 지식

이 책은 개발 전문가가 아닌 분들을 위한 바이브 코딩 서적입니다. 이 책을 읽기 위해 필요한 프로그래밍 지식은 없습니다. HTML이 무엇인지 몰라도 됩니다. 자바스크립트와 자바의 차이를 구분하지 못해도 됩니다. 터미널이 무엇인지, API가 무엇인지 몰라도 문제없습니다. 이 책은 그런 것을 모르는 상태에서 시작해, 모르는 채로도 결과물을 만들고, 만드는 과정에서 필요한 만큼만 알아가도록 짜여 있습니다.

같은 제목의 앞선 책 바이브 코딩 에센셜 with claude code는 터미널이라는 검은 화면에서 Claude Code를 실행하는 방식이었습니다. 부트캠프를 여러 기수 진행하면서 알게 된 사실이 있습니다. 결과물을 만드는 단계보다 터미널, Node.js, VSCode를 설치하고 명령어를 입력하는 준비 단계에서 절반 가까운 분들이 힘들어하셨습니다. 배우고 싶은 것은 바이브 코딩인데 정작 막히는 곳은 개발자의 도구였던 것이죠. 그래서 이 책은 도구를 바꿨습니다. Claude Desktop 하나만 설치하면 됩니다. 터미널을 열지 않고, 명령어를 타이핑하지 않으며, 마우스 클릭과 한국어 문장만으로 진행합니다.

혹시 프로그래밍을 이미 하실 줄 아는 분이라면 이 책은 다소 느리게 느껴질 수 있습니다. 그런 분은 앞선 책이 더 맞습니다. 이 책은 아래와 같은 분들을 위해 쓰였습니다.

1.1 아이디어는 있지만 실현 방법을 모르는 기획자와 창업가

"이런 서비스가 있으면 좋겠는데..."라는 생각을 하시는 분, "우리 서비스에 이러한 기능이 있었으면 좋겠는데..."라는 생각을 하시는 분입니다. 견적을 받아보니 5천만 원, 개발 기간 3개월이라는 답변에 좌절했던 경험이 있으신가요? 또는 개발을 의뢰했는데 결과물이 마음에 들지 않아 다시 개발자를 찾아야 했던 경험이 있으신가요? 개발자와 소통이 어려워 원하는 바를 제대로 전달하지 못했던 경험이 있으신가요?

이제 서비스를 직접 만들 수 있습니다. 완벽하지 않아도 됩니다. 작동하는 프로토타입을 만들어 시장의 반응을 먼저 확인하고, 그다음에 전문 개발팀과 협업하면 됩니다. 무엇보다 개발자와 대화할 때 "이렇게 만들어봤는데, 여기서부터 도와주실 수 있나요?"라고 말할 수 있게 됩니다.

바이브 코딩을 활용하면 기획자와 창업가에게 다음과 같은 이점이 있습니다.

• 아이디어 검증 속도 향상: 몇 시간 만에 MVP(최소 기능 제품)를 만들어 시장 반응을 테스트할 수 있습니다.
• 개발 비용 절감: 외주 개발 없이 초기 프로토타입을 직접 제작할 수 있습니다.
• 개발자와의 소통 개선: 직접 만든 결과물을 기반으로 구체적인 대화가 가능해집니다.

1.2 바이브 코딩을 경험해보고 한 단계 도약하고 싶은 분

부트캠프를 해보면 아래와 같은 분들이 많습니다.

"단 한 번만 경험해보면 반복해서 숙달하는 것은 자신이 있는데, 어디에도 그런 안내서가 없습니다. 다들 코딩을 좀 아시는 분 대상으로 사용법만 알려줘요."
"주변 개발자에게 물어보니 제가 원하는 결과물은 프론트엔드, 백엔드, 데이터베이스 등 여러 영역이 섞여 있어 혼자 하기가 어렵다는 답변을 받았어요."
"채팅창에서 간단한 웹사이트를 여러 번 만들어봤는데, 그 이상을 어떻게 해야 할지 모르겠어요."

우리는 이 책을 집필하면서 이런 분들에게 가장 큰 도움을 드리고 싶었습니다. 어떤 책에서도 소개하지 않고, 다루기도 어려운 부분이 바로 이 지점입니다. 우리는 여러 차례 바이브 코딩 캠프를 해보면서 코딩을 모르는 분도 어려운 결과물을 충분히 만들 수 있는 방법을 고민해왔습니다. 사내에서 비개발자와 개발자 대상으로 바이브 코딩 해커톤도 진행했고, 그 결과물 상당수는 비개발자의 손에서 나왔습니다. 여러분이 위와 같은 고민을 하고 계신다면, 이 책이 큰 도움이 될 것입니다.

1.3 개발의 영역에 다가서고 싶은 디자이너

피그마(Figma)에서 나온 디자인으로 결과물을 만들고 싶은 디자이너분들입니다. 버튼 간격 등이 맞지 않아 "이것만 수정해주세요"라고 말하고 '오늘은 수정이 되었나? 확인해볼까? 다시 물어볼까?'라는 생각을 가지지 않아도 됩니다. 이제 "이렇게 수정해주세요."가 아닌 "이렇게 수정했어요. 반영해도 되나요?" 또는 "이런 서비스를 구현해봤는데 사용해보고 말씀해주세요"라고 말할 수 있습니다.

디자인을 해서 개발하는 시대가 아니라, 디자인 주도 개발을 할 수 있게 됩니다. 인터랙션을 직접 구현하고, 애니메이션을 추가하며, 반응형 디자인을 즉시 테스트할 수 있습니다. 테스트해보고 좋은 결과물은 그대로 개발자에게 전달하면 됩니다. 디자인 핸드오프(Handoff)가 필요 없는 세상, 여러분이 만들어갈 수 있습니다.

디자이너가 바이브 코딩을 통해 얻을 수 있는 변화는 다음과 같습니다.

1.4 엑셀 지옥에서 벗어나고 싶은 직장인

매달 같은 보고서를 만들기 위해 수십 개의 엑셀 파일을 열고, 복사하고, 붙여넣기를 반복할 필요가 없습니다. "이거 자동화할 수 없을까?"라고 생각해 유튜브에서 자동화 도구를 수십 개 사용해보고 생각보다 어렵다고 느끼신 분들은 이제 Claude Desktop으로 자동화 도구를 직접 '자연어'로 만들고 연결할 수 있습니다. 폴더 하나를 지정하고 말로 시키면 Claude가 그 폴더 안에서 파일을 읽고, 정리하고, 여러분이 원하는 엑셀 보고서를 만듭니다.

보고서뿐인가요? 수집한 데이터로 대시보드를 만들고 싶다면 개발자에게 도움을 요청할 필요가 없습니다. 그것도 즉시요. 이렇게 말하기만 하면 됩니다.

"지금 이 폴더에 있는 엑셀 파일을 분석해서 대시보드로 만들어줘."

바이브 코딩으로 자동화할 수 있는 직장인의 반복 업무 예시입니다.

1.5 미래를 준비하는 학생

컴퓨터공학과가 아니어도 됩니다. 문과생도, 예체능 전공자도 모두 환영합니다. 오히려 다양한 배경이 장점이 될 수 있습니다. 경영학도는 비즈니스 로직을 더 잘 이해하고, 심리학도는 사용자 경험을 더 깊이 고민하며, 예술 전공자는 더 창의적인 인터페이스를 만들 수 있습니다. 지금 시작하여 졸업할 때가 되면, 남들보다 2년, 3년을 앞서갈 수 있습니다.

전공별로 바이브 코딩을 활용할 수 있는 영역을 정리해보았습니다.

나이가 어려도 괜찮습니다. 아무 지식이 없어도 괜찮습니다. 바로 뒤 절에서도 얘기하지만 아래 결과물은 제 아들이 3일 만에 만든 결과물입니다. 아들은 초등학교 2학년입니다. 여러분도 하실 수 있습니다.

게임은 아래 링크에서 실제 진행해볼 수 있습니다.

• 링크: https://weniv.github.io/minhogame/

1.6 새로운 커리어를 모색하는 전직자

"40대에 새로 시작하기엔 너무 늦지 않았을까?" 그렇지 않습니다. 오히려 여러분의 도메인 지식이 빛을 발할 때입니다. 20년간 물류 업계에서 일했다면, 물류 시스템을 누구보다 잘 이해하고 있을 것입니다. 10년간 병원에서 근무했다면, 의료 현장의 문제점을 정확히 알고 있을 것입니다. AI 시대에 도메인 전문성과 만드는 능력을 결합하는 것은 매우 강력한 조합입니다.

바이브 코딩은 그 지식을 직접 솔루션으로 만들 수 있게 해줍니다. 개발자가 되는 것이 아니라, 여러분의 전문성에 만드는 능력을 더하는 것입니다.

1.7 효율성에 목마른 경영자와 관리자

"우리 회사도 뒤쳐지지 않고 DX(디지털 전환), AX(인공지능 전환)를 해야 하는데..." 라고 고민하는 분들입니다. 실제 경험해보지 않으면 어떠한 방식으로 전환을 해야 할지 감을 잡기 어렵습니다. 사내에서 어떤 방식으로, 어떤 단계별로 도입을 해야 할지 막막할 수 있습니다.

바이브 코딩은 치열한 경쟁 환경에서 살아남을 수 있는 강력한 무기입니다. 시간이 지나면 도태되지 않기 위해서라도 경영자와 관리자라면 반드시 경험해보아야 할 역량이 될 것입니다. 지금 경험해보고 도입하세요. 변화에 항상 민감하게 대응할 필요는 없지만, 패러다임 변화에는 능동적인 대응이 필요합니다. 그리고 그 경험은 직접 해봐야 합니다. 이 책이 터미널을 걷어낸 이유도 여기에 있습니다. 실무자에게 시켜보는 것이 아니라 여러분이 직접 만들어볼 수 있어야 도입 판단이 가능합니다.

2. 읽는 방법

이 책은 프로그래밍 지식이 없는 분들을 위한 '기초 입문서'입니다. 2장부터 순서대로 읽으시길 권합니다. 각 장의 실습은 앞 장의 실습 위에서 이어지도록 짜여 있습니다.

특히 처음부터 너무 어려운 내용을 시도하기보다는, 기초적인 예제부터 시작해 점차 복잡한 프로젝트로 나아가세요. 각 장의 실습을 완료하며 자신감을 쌓아가시길 바랍니다.

2.1 점진적으로 난이도 높이기

난이도를 높이는 단계는 아래와 같습니다. 각 단계별로 2~3개의 프로젝트를 진행하고 다음 단계로 넘어가시는 것을 권합니다. 이 책을 천천히 따라가시면 점진적으로 배울 수 있도록 구성이 되어 있습니다. 자세한 용어 설명은 해당 장에 이어집니다. 여기서는 전체적인 흐름만 이해하고 넘어가시고, 필요한 경우 다시 이 절로 와서 참고해주세요.

2.2 각 단계별 요약 설명

1. 백엔드 없이 프론트엔드만으로 개발하기

   • 난이도: 1
   • 요약: 랜딩페이지 등 저장공간이 불필요한 서비스
   • 배포: GitHub Pages, Netlify, Vercel 등
   • 설명: 이 단계에서는 HTML, CSS, JavaScript로 만들어진 간단한 웹 페이지를 만듭니다. 저장공간이 필요 없는 랜딩 페이지, 포트폴리오 사이트 등을 제작해보세요. 코드는 Claude Desktop의 Code 탭이 만들고, 여러분은 결과를 보고 다듬습니다. 이 책의 실습 대부분이 이 단계입니다.

2. 백엔드 없이 프론트엔드만으로 개발하기

   • 난이도: 2 ~ 5
   • 요약: 로컬스토리지 또는 외부 솔루션을 활용한 저장공간이 필요한 서비스
   • 배포: GitHub Pages, Netlify, Vercel 등
   • 설명: 이 단계에서는 브라우저 안의 저장공간(로컬 스토리지)이나 Disqus, Utterances, Giscus 등 외부 솔루션을 활용하여 데이터를 저장하는 웹 애플리케이션을 만듭니다. 예를 들어, 간단한 댓글, 좋아요 등의 서비스는 백엔드 없이 구현할 수 있습니다.

3. 백엔드 없이 프론트엔드와 구글 시트 등의 외부 DB를 이용해 개발하기

   • 난이도: 5 ~ 10
   • 요약: 구글 시트, Firebase, Notion API 등 직접 연동을 해야 하는 솔루션
   • 배포: GitHub Pages, Netlify, Vercel 등
   • 설명: 이 단계에서는 구글 시트, Firebase, Notion API 등 외부 DB를 활용하여 데이터를 저장하고 관리하는 웹 애플리케이션을 만듭니다. 외부 서비스 쪽 설정은 여러분이 웹 화면에서 클릭으로 해야 하는 부분이 생깁니다. 5장에서 구글 시트를 연결한 간단한 접수 페이지를 만들어봅니다.

4. 백엔드 + 프론트엔드로 개발하기

   • 난이도: 50 ~ 100
   • 요약: Django, Rails 등 백엔드 풀스택 프레임워크를 활용한 서비스
   • 배포: Render, Lightsail 등
   • 설명: 이 단계에서는 사용자 인증, 데이터베이스 관리, 서버 로직 등을 포함한 완전한 웹 애플리케이션을 만듭니다. 이 책에서는 개념과 판단 기준까지만 다룹니다. 이 단계에 진입했다면 만들어진 것을 이해하지 못한 상태로 배포하는 것은 권장하지 않습니다. 유지보수 때문에 그렇습니다. 또한 개인 정보가 포함된 서비스라면 보안에 신경 써야 하며, 개인정보보호법, 정보통신망법 등 관련 법률이 무엇이 있는지도 반드시 숙지해야 합니다.

3. 전체 구성

책의 전체 구성은 아래와 같습니다. 앞선 책과 가장 크게 달라진 곳은 3부입니다. 요구사항 명세서를 길게 쓰는 대신, 한 문단으로 시키고 바로 실행해서 검토하는 방법을 다룹니다. 그 이유는 10장 첫머리에서 설명합니다.