[01장] 바이브 코딩 시작하기
01.1 바이브 코딩을 하기 전에 꼭 알아두면 좋은 지식
__ IDE가 뭔가요?
__ 에이전트가 뭔가요?
__ 에이전틱한 커서의 특징 다섯 가지
01.2 커서 회원 가입, 구독, 구독 해지까지
__ 커서 회원 가입하고 결제 카드 등록하기
__ 커서 결제 카드 제거하기
__ 커서 프로 플랜 결제 후 대시보드 살펴보기
01.3 커서 설치하고 인터페이스 살펴보기
__ 커서 설치하고 기본 설정하기
__ 커서의 핵심 기능 하나, 대화 모드 설정
__ 커서의 핵심 기능 둘, 모델 설정
__ 커서의 핵심 기능 셋, 컨텍스트
01.4 바이브 코딩 시작하기
__ [바로 01] 애플 사이트 따라 만들기
__ [바로 02] 사과 게임 만들어보기
__ [바로 03] 커서 브라우저로 크롤링 쉽게 해보기
[총정리 퀴즈]

[02장] 터미널과 친해지기
02.1 터미널이 뭐지?
__ 터미널이라는 이름이 붙은 이유
__ 터미널에서 할 수 있는 일은 무엇일까?
02.2 터미널 사용해보기
__ [바로 04] 터미널 직접 조작해보기
__ [바로 05] 바탕화면 정리시켜보기
[총정리 퀴즈]

[03장] 커서로 문서, 프레젠테이션, 학습 자료 만들어보기
03.1 커서로 문서 작성해보기
__ 마크다운이란?
__ [바로 06] 커서로 마크다운 문서 작성해보기
__ [바로 07] 커서와 Marp로 프레젠테이션 작성해보기
__ [바로 08] 커서로 워드 문서 만들기
__ [바로 09] 커서로 마인드맵 그리기
03.2 커서로 시각화 문서 작업해보기
__ [바로 10] draw.io로 멋진 흐름도 그려보기
__ [바로 11] 수학 수식 쉽게 입력하기
[총정리 퀴즈]

[04장] 바이브 코딩의 핵심, 웹 기술
04.1 웹 기술의 기초, HTML, CSS, 자바스크립트 알아보기
__ 웹사이트의 뼈대를 담당하는 HTML
__ 웹사이트를 아름답게 하는 CSS
__ 웹사이트에 기능을 추가하는 자바스크립트
__ [바로 12] HTML만으로 구성된 웹사이트 만들어보기
__ [바로 13] CSS를 더해서 웹사이트에 옷 입히기
__ [바로 14] 자바스크립트를 더해서 기능 추가하기
04.2 웹 기술로 다양한 웹사이트 만들어보기
__ [바로 15] 입체 명함 효과가 있는 자기소개 페이지 만들기
__ [바로 16] 노션 스타일의 마크다운 글쓰기 도구 만들기
[총정리 퀴즈]

[05장] 바이브 코딩과 함께 프런트엔드 기술의 세계로
05.1 프런트엔드란 무엇일까?
__ 리액트가 뭔가요?
__ [바로 17] 리액트로 클리커 게임 만들어보기
__ 바이브 코딩을 하면 꼭 만나게 되는 npm run dev
05.2 Next.js로 바이브 코딩해보기
__ 리액트를 쓴다면서요! Next.js는 뭐예요?
__ [바로 18] Next.js로 간단한 웹사이트 만들어보기
__ [바로 19] 인스타그램과 비슷한 사이트 만들어보기
__ 로컬 스토리지가 뭔가요?
__ [바로 20] 새로고침해도 유지되는 뽀모도로 타이머 만들기
__ [바로 21] 메모 앱 만들어보기
[총정리 퀴즈]

[06장] 바이브 코딩과 함께 디자인 기술 사용해보기
06.1 라이브러리와 프레임워크 알아보기
__ 프레임워크가 뭔가요?
__ 웹사이트를 꾸며주는 CSS 도구
__ [바로 22] 메모 앱 디자인 변경해보기
06.2 디자인 도구로 아름다운 앱 만들어보기
__ [바로 23] v0 서비스로 더 쉽게 웹사이트 만들기
__ [바로 24] Tweakcn으로 아름다운 글쓰기 도구 만들어보기
[총정리 퀴즈]

[07장] 에이전트를 보완하는 기술 알아보기
07.1 에이전트에게 지침 미리 내려두기 AGENTS.md
__ 커서가 한글로 대답하는 이유는?
__ [바로 25] AGENTS.md로 지침 등록하기
__ AGENTS.md의 적용 범위 알아보기
__ AGENTS.md는 만능? 주의할 점도 있어요
07.2 에이전트가 알아서 꺼내 쓰는 스킬
__ 스킬의 구성 알아보기
__ 스킬과 AGENT.md 비교하기
__ [바로 26] 나만의 스킬 직접 만들어보기
__ [바로 27] 잘 만들어놓은 스킬 가져다 사용하기
07.3 특정 작업을 사용하기, 서브에이전트
__ 언제 서브에이전트를 쓰면 좋을까?
__ [바로 28] 서브에이전트 만들어보기
[총정리 퀴즈]

[08장] 내가 만든 사이트 서비스를 세상에 배포해보기
08.1 배포? 서비스? 그게 뭐죠?
__ 24시간 사용자 요청을 기다리는 컴퓨터, 서버
__ localhost와 포트 번호가 뭐예요?
__ 친구가 내가 만든 웹 서비스를 보려면?
08.2 내가 만든 사이트 배포해보기
__ 버셀이 뭐죠?
__ [바로 29] 깃허브 페이지에 간단한 사이트 배포해보기
__ [바로 30] 깃허브 페이지에 배포한 사이트 수정하기
__ [바로 31] 버셀 서비스에 일정 공지 사이트 배포해보기
[총정리 퀴즈]

[09장] 데이터베이스로 웹사이트 주요 기능 구현하기
09.1 데이터베이스 이해하고 사용해보기
__ 데이터베이스에도 종류가 있어요
__ [바로 32] 로컬 데이터베이스로 회원 가입이 되는 게시판 만들기
09.2 수파베이스로 데이터베이스 배포하기
__ 수파베이스와 파이어베이스 알아보기
__ [바로 33] 로컬 기반 데이터베이스로 노션 클론 사이트 시작하기
__ [바로 34] 수파베이스 도입하기
__ 구글 로그인의 원리를 이해해봅시다
09.3 구글 로그인 도입하기
__ [바로 35] 구글 개발자 콘솔에 정보 등록하기
__ [바로 36] 구글 Provider 설정하기
09.4 버셀로 서비스 런칭하기
__ [바로 37] 깃허브에 푸시하기
__ [바로 38] 깃허브 리포지터리를 버셀에 연결하고 배포하기
__ [바로 39] 버셀 배포 후 수파베이스에 돌아갈 주소 입력해주기
[총정리 퀴즈]

[10장] 크롤링 프로그램 만들기
10.1 크롤링의 기초 공부하기
__ [바로 39] 크롤링 핵심, 태그와 속성 이해하기
__ [바로 40] 내가 원하는 데이터는 어떻게 가져올 수 있을까?
__ 크롤링, 막 해도 되는 것일까?
10.2 다양한 방법으로 크롤링해보기
__ [바로 41] 크롬 브라우저의 개발자 도구로 1년 치 금 시세 크롤링하기
__ [바로 42] 데이터도 꿰어야 보배, 통계 처리하고 시각화하기
__ [바로 43] 해외 주식 크롤링 프로그램 만들기
__ [바로 44] 알리 익스프레스 사이트 크롤링하기
[총정리 퀴즈]

[11장] 제대로 바이브 코딩하는 법 배워보기
11.1 에이전트가 다 만들어주는 시대, 진짜 필요한 지식은?
__ 프로그램의 3요소 이해하기 : 입력, 처리, 출력
__ 문제에 따라 활용하기 쉬운 데이터 만들기
__ 바꾸기 전에 저장하는 습관, 깃을 사용해보기
__ 바이브 코딩의 한계를 극복하는 노하우, 클린 아키텍처
__ [바로 45] 깃으로 세이브 포인트 만들고 사용해보기
11.2 프로그램 만들면서 배운 내용 적용해보기
__ [바로 46] GUI 애플리케이션으로 쓸 수 있는 파일 이름 변환기 만들기
__ [바로 47] 클린 아키텍처로 마음 한 줄 일기장 만들어보기
[총정리 퀴즈]

[12장] 내 프로그램을 더 풍부하게, API 사용해보기
12.1 API의 개념 알아보기
__ API가 뭐예요?
__ [바로 48] 랜덤 이미지를 주는 API로 미술관 사이트 만들기
12.2 내 프로그램에 API 적용해보기
__ [바로 49] 한국거래소 주식 데이터 API로 나만의 대시보드 만들기
__ [바로 50] 공공 API로 식당 추천 사이트 만들기
[총정리 퀴즈]

저자 : 박현규
최신 AI 도구를 리서치해 소개하는 ai100.co.kr을 운영한다. 25년 5월에는 세계 최대 MCP 마켓 ‘스미더리’에서 전 세계 TOP 100 유저로 선정되었고 커서 공식 앰배서더로도 활동 중이다. IT 지식을 더 쉽게 나누기 위해 책을 쓰고, 유튜브와 쇼츠를 제작한다.
_저서
__《이게 되네? 챗GPT 미친 크롤링 24제》
__《이게 되네? 클로드 MCP 미친 활용법 27제》
__《요즘 바이브 코딩 커서 AI 30가지 프로그램 만들기》
__《요즘 바이브 코딩 깃허브 코파일럿 31가지 프로그램 만들기》
_강의
__대구 NIA 본원 MCP 강의
__대구 한국로봇산업진흥원 MCP 강의
__멀티캠퍼스 MCP 강의

_SNS
__Ai100 _ ai100.co.kr
__Facebook _ facebook.com/limedaddy8924
__YouTube _ youtube.com/@editorp89
__GitHub _ github.com/canine89

★ AI가 알아서 코딩하는 시대, “문송합니다”는 이제 그만!
★ 이런 분들께 이 책을 추천합니다
_코딩의 'ㅋ'도 모르는 완전 생초보터미널이 뭔지, 에이전트가 무슨 뜻인지 전혀 몰라도 괜찮습니다. 컴퓨터 구조나 복잡한 문법부터 외우는 대신, 당장 눈에 보이는 결과물을 만들며 코딩에 대한 두려움을 없애보세요.
_나만의 아이디어를 진짜 결과물로 만들고 싶은 비전공자/학생머릿속 상상만으로 끝내지 마세요. 커서와 v0 등 디자인 도구 설치부터 차근차근 따라 하다 보면, 어느새 기획안이 진짜 작동하는 웹사이트로 완성되는 경험을 할 수 있습니다.
_반복되는 업무를 내 손으로 자동화해보고 싶은 직장인시중에 내 업무에 꼭 맞는 도구가 없어 답답하셨나요? 엑셀 파일 자동 병합, 이메일 발송 자동화 등 내 업무 시간을 확 줄여줄 맞춤형 프로그램을 코딩 지식 없이도 직접 명령해서 만들어 보세요.
_어려운 전문 용어에 막혀 포기했던, 친절한 입문서가 필요한 분전공서나 어려운 개발 용어에 막혀 프로그래밍 공부를 포기한 경험이 있다면 이 책으로 다시 시작해 보세요. 저자 운영 유튜브와 세심한 학습 구성이 여러분을 든든하게 이끌어줄 겁니다.

★ 비교 불가! 커서 공식 앰배서더 & 스미더리 TOP 100 유저의 찐 노하우
이책은 단순히 번역된 매뉴얼을 짜깁기한 책이 아닙니다. 저자는 커서 공식 앰배서더이자 글로벌 MCP 마켓인 스미더리의 TOP 100 유저로 꼽힐 만큼 AI 활용과 바이브 코딩에 진심입니다. 전 세계 가장 빠른 AI 코딩 트렌드의 최전선에 있는 저자가 소개하는 바이브 코딩 꿀팁부터 실무에 쓸 수 있는 알짜배기 스킬까지 모두 만나보세요.

★ 엑셀 합치기? 기본이죠, 구글 로그인을 지원하는 '풀스택 서비스'까지!
★ 50개의 실습 + 보너스 PDF 3종으로 '바로 배워 바로 쓰는' 효율 학습
단순히 이론만 나열하거나 의미 없는 프로젝트만 만들고 끝나는 구성이 아닙니다. 이 책은 커서 설치부터 터미널 환경, 핵심 웹 기술(HTML/CSS/JS/React/Next.js), 데이터베이스 연동, API, 크롤링 등 바이브 코딩에 필요한 핵심 개념을 각 장에서 명확히 익힌 후, 그 장에 곧바로 배치된 [바로] 실습을 통해 완벽히 내 것으로 만듭니다.
금 시세 크롤러, PDF 페이지 추출 등 당장 내일 출근해서 쓸 수 있는 업무 자동화 도구 제작은 기본! 나아가 회원가입, 구글 로그인 기능이 들어간 노션 클론 사이트를 만들고, 수파베이스 데이터베이스를 연동하여 버셀로 전 세계 누구나 접속할 수 있게 배포하는 풀스택 과정을 경험해보세요.

★ 주니어 개발자도 탐내는 고도화된 바이브 코딩 레벨업 노하우 수록
이 책은 커서를 중심 도구로 다루지만 특정 도구에 국한되지 않고 AI와 원하는 결과물을 만드는 범용적인 방식을 담으려고 노력했습니다. 효율적인 AI 지휘를 위한 컨텍스트 주입 기법, 에이전트에게 사전 지침을 내리는 AGENTS.md 작성법, AI가 스스로 꺼내 쓰는 스킬과 복잡한 작업을 분담하는 서브에이전트 설정법을 입문자의 눈높이에서 쉽게 알려줍니다. 프로젝트가 망가지지 않도록 코드를 바꾸기 전에 저장하는 깃 활용법과 AI의 한계를 극복하는 클린 아키텍처까지 학습하고 나면 커서뿐만 아니라 안티그래비티 등 다른 어떤 AI 도구와도 훨씬 쉽게 원하는 결과물을 만들 수 있을 겁니다.

★ 혼자 끙끙 앓는 독학은 이제 그만!
★ 입문자의 마음을 가장 잘 아는 ‘바로 배워 바로 쓰는’ 시리즈
새로운 IT 기술을 배우겠다고 굳게 다짐하며 두꺼운 책을 샀지만, 알 수 없는 오류 메시지나 어려운 설명 앞에서 조용히 책을 덮어본 적 있으신가요? ‘바로 배워 바로 쓰는’ 시리즈는 바로 그 막막하고 좌절스러웠던 입문자들의 현실적인 고민에서 출발했습니다.
단순히 지식을 나열하는 것을 넘어, 처음 배우는 사람이 무엇을 가장 답답해하고 어디서 포기하는지를 고민하며 만든 ‘바로 배워 바로 쓰는’ 시리즈의 4가지 강점을 소개합니다.

[강점 01] 어려운 외계어는 그만! 일상의 비유와 6단계 구조로 원리를 확실히 체화합니다
'바로 배워 바로 쓴다'는 말이 결코 대충 배운다는 뜻은 아닙니다. 학습을 위해 필요한 내용은 꼼꼼히 다루되 복잡한 개념은 일상적인 비유로 친절하게 번역해 진입 장벽을 완전히 낮췄습니다. 방대한 이론의 늪에 빠져 길을 잃지 않도록, [워밍업 ？ NOTE ？ 1:1 코칭 ？ 잠깐 퀴즈 ？ 바로 핵심 요약 ？ 총정리 퀴즈]로 이어지는 탄탄한 6단계 반복 학습 구조를 통해 뼈대가 되는 원리를 내 것으로 확실하게 만듭니다.
[강점 02] 억지 암기는 그만! 가벼운 실습으로 시작해 '실전 무기'로 끝나는 완벽한 빌드업
당장 쓰지도 못할 코드를 외우며 시간을 낭비하지 마세요. '바로 배워 바로 쓰는’ 시리즈는 필수 개념을 가벼운 실습으로 빠르게 흡수한 뒤, 내 일상과 업무의 불편함을 당장 해결해 줄 '실전 맞춤형 프로젝트'로 직행할 수 있도록 다양한 프로젝트를 보너스 PDF로 제공합니다. 머릿속으로만 이해하고 책을 덮는 것이 아니라, 배운 그 자리에서 프로그램을 만들어보는 성취감을 선사하며 당신의 지식을 가장 강력한 현실의 무기로 완성하세요.
[강점 03] 포기 없는 완주를 위한 든든한 백업! 맞춤형 진도표 & 실습 복붙 자료 제공
혼자서도 페이스를 잃지 않도록 입문자의 가장 효율적인 학습을 돕습니다. 학습 시작 전 사전 지식을 점검하고, 독학, 스터디용 '30일 완성 진도표'나 단기 집중용 '16회 완성 진도표' 중 내게 맞는 길을 선택해 보세요. 또한 본문에 사용된 긴 프롬프트와 예제 데이터는 모두 온라인으로 제공됩니다. 지루한 타이핑에 힘 빼지 말고 ‘딸깍’ 실습하며 오직 만드는 재미에만 집중하세요.
[강점 04] 수시로 업데이트되는 AI 환경, 끝까지 곁에서 돕겠습니다
하루가 다르게 발전하는 AI 도구들, 어제 다르고 오늘 다른 업데이트 속도 때문에 종이책만으로는 학습에 한계가 있지 않을까 걱정되시나요? 책에 적힌 대로 따라 했는데 예상치 못한 버그가 발생하거나 무작위 결과가 나왔을 때, 화면 앞에서 막막했던 적이 있나요? '바로 배워 바로 쓰는' 시리즈는 학습자가 겪을 당혹감을 깊이 공감하기에, 실습 곳곳에 [1:1 코칭] 코너를 마련하여 오류 대처법을 안내합니다. 나아가 언제든 질문할 수 있는 저자 직통 오픈카톡방과 업데이트 내용을 빠르게 소개하는 유튜브 강의를 지원합니다. 책의 잘 짜여진 커리큘럼, 트렌드에 발맞추는 최신 AI 노하우까지 두 마리 토끼를 다 잡아보세요!

▶ 유튜브 링크 : youtube.com/@editorp89
▶ 오픈카톡 링크 : open.kakao.com/o/ggK7EAJh