돈 되는 커서 AI 바이브 코딩 - 기획 디자인 앱 스토어 출시까지 솔로프리너를 위한 전 과정 로드맵

★ 완벽한 코드보다 완성된 서비스, 로컬호스트를 벗어나 세상 밖으로!
★ 웹 배포, 앱스토어 심사, 사용자 분석까지 한 권으로 끝내는 바이브 코딩
★ 30개 이상의 웹·앱을 완성하며 얻은 저자의 실전 노하우를 한 권에!

『돈 되는 커서 AI 바이브 코딩』은 커서 AI와 대화하며 아이디어를 실제 웹·앱 서비스로 완성하는 전 과정을 안내하는 실전 입문서다. 어머니의 버스 이용 불편을 해결한 앱부터 앱 스토어 카메라 부문 1위를 기록한 서비스까지, 30개 이상의 웹·앱을 직접 기획하고 출시한 저자의 경험을 바탕으로 구성했다.

커서 AI를 설치하고 첫 파일을 만드는 기초 단계에서 출발해 나만의 웹페이지, AI 운세 서비스, 스마트폰에 설치해 쓰는 할 일 관리 웹앱, 밸런스 게임 커뮤니티, AI 그림일기 모바일 앱을 차례로 완성한다. 간단한 웹페이지에서 시작해 AI API를 연결하고, 로그인과 데이터베이스를 갖춘 커뮤니티를 만든 뒤 모바일 앱을 앱 스토어에 출시하는 과정까지 단계적으로 경험할 수 있다.

이 책에서 말하는 바이브 코딩은 모든 판단을 AI에게 맡기는 방식이 아니다. 무엇을 만들지 결정하고, 필요한 기능과 사용 흐름을 설명하며, AI가 만든 결과가 의도에 맞는지 판단하는 일은 사람이 주도한다. 독자는 프로젝트를 따라가며 AI에게 필요한 맥락을 전달하고, 작업을 단계별로 요청하며, AI와 함께 오류의 원인을 찾아 수정하는 방법을 익힌다.

책을 마치면 코드를 많이 외우지 않아도 AI와 함께 아이디어를 구현하고, 배포하고, 실제 사용자에게 공개하는 서비스 개발의 전체 흐름을 경험하게 된다. 머릿속에만 있던 아이디어를 사람들이 접속하고 설치해 사용할 수 있는 서비스로 완성해 보자.

★ 이 책에서 완성할 실제 서비스

[웹 서비스]
_나만의 웹페이지 | 프로필과 주요 링크를 한곳에 모아 배포하기
_오늘의 운세 | AI가 운세와 조언을 생성하는 대화형 웹 서비스 만들기
_밸런스 게임 커뮤니티 | 로그인, 게임 생성, 투표, 댓글 기능을 갖춘 커뮤니티 구현하기

[모바일 앱 서비스]
_할 일 관리 앱 | 스마트폰 홈 화면에 설치해 사용하는 Todo 앱 만들기
_AI 그림일기 앱 | 일기를 네 컷 만화로 바꾸는 앱을 만들고 앱스토어에 출시하기

[목 차]

CHAPTER 01. 커서 AI 알아보기
1.1 실습 환경 설정
_1.1.1 커서 AI란?
_1.1.2 커서 AI 설치하기
_1.1.3 Node.js 설치하기
1.2 커서 AI와 작업 환경 익히기
_1.2.1 커서와 첫 대화 나누기
_1.2.2 확장 프로그램 설치하기
[더 알아보기] 커서 AI 확장하기

CHAPTER 02. 나만의 웹페이지 만들기
2.1 My Vibe 웹페이지 구현하기
_2.1.1 프로젝트 미리보기
_2.1.2 HTML 뼈대 만들기
_2.1.3 CSS 디자인 수정하기
_2.1.4 자바스크립트 기능 구현하기
_2.1.5 다양한 기능 추가하기
2.2 웹페이지 배포하기
_2.2.1 Netlify로 쉽게 배포하기
_2.2.2 URL 이름 변경하기

CHAPTER 03. 오늘의 운세 서비스 배포하기
3.1 AI 운세 앱의 뼈대 만들기
_3.1.1 프로젝트 미리보기
_3.1.2 제미나이 API 불러오기
_3.1.3 프로젝트 뼈대 만들기
_3.1.4 디자인 수정하기
3.2 운세 서비스 기능 구현하기
_3.2.1 상태와 로직 연결하기
_3.2.2 제미나이 API 연결하기
_3.2.3 서식 개선하고 공유 기능 추가하기
3.3 웹 앱 배포하기
_3.3.1 자동 배포를 위한 깃과 깃허브 설정하기
_3.3.2 Netlify에서 GitHub 저장소 연동하기

CHAPTER 04. 나만의 할 일 관리 앱
4.1 프로젝트 미리보기
_4.1.1 Vibe Todo 앱 소개하기
_4.1.2 AI에게 작업 규칙 미리 정해 주기
4.2 Vibe Todo 앱 구현하기
_4.2.1 Agent 모드로 기본 Todo 앱 만들기
_4.2.2 데이터 유지하기
4.3 배포하고 커스터마이징하기
_4.3.1 PWA란?
_4.3.2 PWA 설정하기
_4.3.3 배포하기
_4.3.4 Quick Edit 기능으로 빠르게 수정하기

CHAPTER 05. 밸런스 게임 커뮤니티 만들기
5.1 Vibe Choice 프로젝트 준비하기
_5.1.1 Vibe Choice 서비스 미리보기
_5.1.2 프로젝트 생성 및 기본 구조 설정
5.2 화면 구성하기
_5.2.1 Tailwind CSS
_5.2.2 메인 피드 화면 만들기
5.3 데이터베이스 연결하기
_5.3.1 Supabase 프로젝트 생성
_5.3.2 Vibe Choice에 데이터베이스 연결하기
_5.3.3 데이터베이스에 Google 로그인 정보 연동하기
_5.3.4 데이터베이스에 게임 정보 연동하기
5.4 기능 구현하기
_5.4.1 Google 로그인 구현
_5.4.2 게임 생성 기능 구현
_5.4.3 댓글 기능 구현하고 마무리하기
5.5 웹 앱 배포하기
_5.5.1 깃허브 업로드
_5.5.2 배포하기
_5.5.3 검색 최적화하기

CHAPTER 06. AI 그림일기 앱 구현하기
6.1 그림일기 프로젝트 시작하기
_6.1.1 그림일기 앱 소개
_6.1.2 모바일 앱 개발에 필요한 도구
_6.1.3 프로젝트 구조 설계하기
_6.1.4 Expo Go 앱 설치하기
6.2 UI 레이아웃 만들기
_6.2.1 홈 화면 만들기
_6.2.2 일기 작성 화면 만들기
_6.2.3 UI 마무리하기
_6.2.4 갤러리 화면 만들기
6.3 Firebase 기반 백엔드 설정하기
_6.3.1 Firebase 연결 설정하기
_6.3.2 Firebase와 AI 협업 환경 구성하기
6.4 AI로 그림일기 생성하기
_6.4.1 제미나이 API로 만화 시나리오 생성하기
_6.4.2 네 컷 만화 완성하기

CHAPTER 07. 그림일기 앱 출시하기
7.1 Google 로그인 연동하고, 모바일에서 검증하기
_7.1.1 Firebase Authentication 설정하기
_7.1.2 iOS 앱 배포를 위한 설정
_7.1.3 iOS 앱 검증하기
7.2 iOS 앱 배포하기
_7.2.1 App Store Connect 설정하기
_7.2.2 TestFlight에서 내부 테스트
7.3 앱스토어 심사 통과하기
_7.3.1 앱 아이콘 등록하기
_7.3.2 심사 제출하기
_7.3.3 자주 발생하는 반려 사례와 대응 방법
7.4 초기 사용자 확보 전략
_7.4.1 첫 100명의 사용자 찾기
_7.4.2 커뮤니티와 SNS 활용하기
7.5 서비스 운영과 성장
_7.5.1 GA4로 사용자 행동 분석하기
_7.5.2 데이터를 기반으로 개선하기
_7.5.3 운영과 성장의 반복