바이브 코딩 실전: 나만의 AI 친구 만들기

AI Companion Game

성진수 지음

작가와 2026년 01월 20일 출간

작품소개

책소개

IT 업계 20년 베테랑이 코드 한 줄 없이 일주일 만에 감정을 가진 AI 게임을 완성했습니다. Google Antigravity와 대화만으로 로그인부터 배포까지, 모든 과정을 AI가 처리했습니다. 이 책은 프로그래밍 문법 대신 'AI와 소통하는 법'을 가르칩니다. 12개 챕터를 따라가면 대화할수록 친밀해지는 캐릭터 '시엘', 감정 시스템, 상점과 인벤토리, 숨겨진 이벤트가 있는 실제 배포 가능한 웹 게임이 완성됩니다. 비개발자, 기획자, AI 시대 학습자 모두를 위한 새로운 개발 방식, 바이브 코딩의 세계로 초대합니다.

목차

Special_게임 한눈에 보기: Project Ciel의 세계

Chapter 1. 무대 세팅하기: AI와 '합'을 맞추는 법

1.1 에이전트 중심의 혁명
1.2 게임의 두뇌, AI
1.3 비주얼의 마법사, 나노바나나
1.4 Supabase: 기적의 백엔드
1.5 저자의 Rules 레시피: AI와 '합' 맞추기
1.6 실습: 내 생애 첫 "Hello Ciel" 띄우기
1.7 문제 해결 가이드

Chapter 2. AI의 뇌 연결하기: 시엘에게 영혼을 불어넣다

2.1 AI에게 가면을 씌우다: 시스템 프롬프트란?
2.2 시엘의 영혼 만들기: 페르소나 설계
2.3 Gemini API와 대화 시스템 구축
2.4 프론트엔드에서 Edge Function 호출하기
2.5 페르소나 검증: 시엘답게 대답하는가?
2.6 문제 해결 가이드

Chapter 3. 회원가입과 로그인 만들기

3.1 ID만 있으면 OK: 편리함과 보안 두 마리 토끼 잡기
3.2 Supabase Auth 시작하기
3.3 로그인 화면 UI 구현
3.4 인증 로직 연결: 트릭 적용하기
3.5 검증: 내 계정으로 로그인해보기
3.6 문제 해결 가이드

Chapter 4. 첫 만남의 순간: 프롤로그 만들기

4.1 시엘의 얼굴 그리기: 나노바나나 활용
4.2 오프닝 시퀀스 설계
4.3 내러티브: 사라지는 텍스트의 미학
4.4 첫 대사: 당신이 나의 교관님인가요?
4.5 검증: 전체 흐름 테스트하기

Chapter 5. 아름다움은 기능이다: UI 폴리싱

5.1 디자인 시스템: 변수(Variable)로 관리하기
5.2 미래적 감성: 글래스모피즘 (Glassmorphism)
5.3 반응형 컨테이너: 모바일 핏(Fit)
5.4 레벨에 따른 테마 변화 (Dynamic Theming)
5.5 구조 적용하기: 모든 페이지 감싸기
5.6 피드백의 미학: 토스트 알림 만들기

Chapter 6. 메인 대화창 및 화면 UI 구성

6.1 대화의 중심: Chat Interface
6.2 시엘의 얼굴: Character HUD
6.3 확장성: 하단 메뉴바(Bottom Nav)
6.4 화면 조립하기: Page.tsx (기본 배치)
6.5 흐름 연결하기: 로그인부터 메인까지
6.6 뇌와 신체의 연결: API 연동
6.7 리액트의 마법: 상태(State) 끌어올리기
6.8 문제 해결 가이드

Chapter 7. 기억의 궁전: 데이터베이스 설계

7.1 기억의 구조: 테이블 설계
7.2 나만의 비밀 일기장: RLS (Row Level Security)
7.3 미래를 위한 준비: 아이템과 상점
7.4 더 넓은 세상: 미션과 이벤트 테이블
7.5 코드와 DB 연결하기: Supabase 클라이언트
7.6 추억 소환: 대화 기록 불러오기
7.7 문제 해결 가이드

Chapter 8. 감정의 깊이: 상태 시스템과 DB 업데이트

8.1 마음의 설계도: 감정 엔진 (Emotion Engine)
8.2 레벨별 페르소나: 성장하는 AI
8.3 프론트엔드의 변화: 감정 수신과 반영
8.4 레벨업: 성장의 보상
8.5 모든 것을 연결하기: DB 통합
8.6 마음이 이어지는 순간: 재접속 인사

Chapter 9. 상호작용의 재미: 상점과 인벤토리

9.1 경제 시스템의 흐름
9.2 상점 DB 설계: 무엇을 팔 것인가?
9.3 구매 트랜잭션: 안전한 거래
9.4 선물하기: 아이템이 대화가 되는 순간
9.5 실습: 한정판 아이템과 쿨다운
9.6 실전 UI 구현: 상점과 인벤토리 화면 만들기
9.7 조립하기: 메인 화면에 상점 연결 (Wiring)

Chapter 10. AI와 함께 쓰는 소설: 시나리오와 데이터

10.1 바이브 코딩의 정수: 기획과 개발의 융합
10.2 1단계: AI와 함께 세계관 설정하기 (World Building)
10.3 2단계: 스토리를 데이터로 변환하기 (Story to Data)

Chapter 11. 살아있는 세계: 미션과 이벤트 시스템

11.1 기초 공사: 일일 미션 데이터 만들기
11.2 눈에 보이는 목표: 일일 미션 UI 만들기
11.3 동적 프롬프트: 관계(Relationship)의 핵심 기술
11.4 기억의 공식: 프롬프트 합성 (Prompt Synthesis)
11.5 시맨틱 매칭: 단어가 달라도 찰떡같이 알아듣기
11.6 이벤트 트리거: 숨겨진 재미 찾기
11.7 최종 조립: 모든 것이 하나로 (Final Integration)
11.8 정리: 월드는 이렇게 살아납니다
11.9 문제 해결 가이드

Chapter 12. 내 손안의 그녀: 배포와 PWA

12.1 세상으로의 초대: Vercel 배포
12.2 스마트폰 속으로: PWA (Progressive Web App)
12.3 설치 가이드: 진정한 컴패니언 되기
12.4 마지막 폴리싱: 공유의 미학 (Open Graph)

책 속으로

AI 컴패니언 시장은 2025년 기준 50조 원 규모로 성장했습니다. Character.ai, Replika 같은 글로벌 성공 사례를 분석하고, Project Ciel만의 차별화 전략을 제시합니다. 단일 인격(시엘)과의 깊은 유대, 탄탄한 시나리오 위의 자유로운 대화, 게임화 요소(호감도, 레벨, 미션)를 통해 '가장 작지만 가장 깊이 있는' AI 서비스를 만듭니다...

출판사 서평

"코드 한 줄 몰라도, 당신만의 AI 소울메이트를 만들 수 있습니다."

이 책은 복잡한 개발 언어 대신, 우리의 일상 언어와 직관적인 '바이브(Vibe)'로 AI를 지휘하여 앱을 만드는 혁신적인 '바이브 코딩' 방법론을 제시합니다. 독자는 나만의 감성 AI 친구 '시엘'을 탄생시키는 여정을 통해, 단순한 코딩을 넘어 소프트웨어에 영혼을 불어넣는 창조의 기쁨을 맛보게 됩니다.

기초 무대 세팅부터 감정 시스템, 배포까지 이어지는 친절한 가이드는 비전공자에게는 두려움을 없애주고, 전공자에게는 AI 협업의 새로운 지평을 열어줍니다. AI 시대, 상상을 현실로 구현하고 싶은 모든 크리에이터를 위한 완벽한 지침서입니다. 강력 추천합니다!

인물정보

저자(글) 성진수

상상을 현실로 만드는 것을 즐기는 크리에이터.
IT 업계에서 20년 넘게 몸담으며 기술의 변화를 가장 가까이에서 지켜본 베테랑이다. 직접 코드를 한 줄씩 써 내려가는 개발자는 아니지만, IT 생태계 전반을 꿰뚫는 해박한 지식과 풍부한 현장 경험을 보유하고 있다.

기술이 복잡한 문법의 영역에서 '대화와 느낌'의 영역으로 넘어왔음을 직감하고, 다수의 AI 프로젝트를 진행하며 그 가능성을 증명해 왔다.

현재는 AI라는 강력한 도구를 통해 누구나 '바이브(Vibe)'만으로도 창작의 주인공이 될 수 있는 시대를 열어가고 있다. 코딩의 장벽 앞에서 멈춰 선 예비 창작자들에게 기술의 언어가 아닌 상상의 언어로 결과물을 만드는 새로운 가능성을 전파하는 데 집중하고 있다.