커서 AI 2.0으로 '작심삼일' 부수기: 명세서 하나로 나만의 MBTI 비전보드 앱 만들기 (ft. 바이브 워킹)

안녕하세요! 여러분의 아이디어를 현실로 코딩하는 곳, 바이브랩스입니다.

우리는 왜 매년 '올해는 꼭!' 다짐하며 목표를 세우고, 왜 매번 '작심삼일'로 끝나버릴까요?

저는 그 이유가 우리의 '의지'가 데이터가 아닌 '감정'의 영역에 있기 때문이라고 생각했습니다. 논리적인 '목표'와 감성적인 '나(MBTI)' 사이에 연결고리가 없었던 거죠.

그래서 AI를 활용해 이 둘을 연결하는 '디지털 비전 보드' 앱을 직접 만들었습니다. 16가지 MBTI 성향에 맞춰 나만의 꿈, 목표, 열망을 시각화하고 매일 동기를 부여받는 감성 엔진이죠.

🚀 '바이브 코딩'에서 '바이브 워킹'으로

이번 영상은 단순한 'AI 코딩' 시연이 아닙니다. AI를 나의 아이디어를 구현하는 강력한 '생산성 파트너'로 활용하는 '바이브 워킹(Vibe Working)'의 실제 사례입니다.

프로젝트의 기획(PRD), 기술 명세(TRD), 개발 계획(Prompt Design)이 담긴 '명세서'만 AI에게 전달하고, AI가 스스로 앱을 빌드하도록 지시합니다.

특히 최신 Cursor AI 2.0의 '에이전트(Agents)' 기능을 활용해, 마치 3명의 AI 셰프(Composer, Sonnet, GPT-5)에게 동시에 요리를 주문하고 가장 잘 만든 결과물을 선택하듯이, 병렬로 코드를 생성하고 실시간으로 디버깅하는 전 과정을 생생하게 담았습니다.

AI와 함께라면 아이디어 기획부터 실제 작동하는 서비스 구현까지, 불가능해 보였던 일들이 현실이 됩니다.

여러분의 '작심삼일'을 '매일의 성실함'으로 바꿔줄 AI 기반 '바이브 워킹', 그 과정을 직접 확인해 보세요!

👍 영상이 도움이 되셨다면 '좋아요'와 '구독', '알림 설정'은 큰 힘이 됩니다. 여러분의 아이디어나 AI 활용 팁도 댓글로 자유롭게 남겨주세요!

[비즈니스 및 작가 제안하기]
futurewave@gmail.com

4. ⏰ 타임라인 (주요 섹션)
00:00 인트로
00:08 😥 우리가 매년 목표에 실패하는 이유 (작심삼일)
00:28 🧠 의지는 '데이터'가 아니라 '감정'입니다
00:39 ✨ 새로운 개념: 비전 코딩 (Vision Coding)
00:46 🚀 오늘 만들 앱: MBTI 디지털 비전 보드
01:23 🛠️ 개발 시작: Cursor AI와 명세서(PRD, TRD) 준비
01:40 [PRD] 제품 요구사항: "MBTI 기반 비전보드"
02:31 [TRD] 기술 스택: "Next.js, Isar DB, ShadCN..."
03:11 [Prompt] AI 개발 마일스톤 설계
03:37 🤖 Cursor AI 2.0의 핵심 기능: '에이전트(Agents)' 소개
05:57 (ft. Git Worktree: AI 병렬 작업의 비밀)
06:50 1️⃣ 단계: 프로젝트 초기 설정 (마일스톤 0)
07:23 ⚔️ AI 셰프 3명(Composer, Sonnet, GPT-5) 동시 작업 시작!
07:48 💡 Cursor 2.0의 '리뷰' 기능 (코드 Diff 확인)
08:33 🌳 Git 커밋 및 개발 서버 실행 (npm run dev)
10:01 1차 테스트: 기본 UI 확인
10:13 2️⃣ 단계: DB 스키마 및 16개 MBTI 카드 UI 구현
11:45 🐞 실시간 디버깅 #1: AI가 만든 에러 발생
12:56 2차 테스트: 16개 MBTI 카드 완성!
13:13 🐞 실시간 디버깅 #2: 카드 클릭 시 이동 오류 (새 에이전트 활용)
13:59 🐞 실시간 디버깅 #3: 중복 ID 및 Next.js 버전 문제
15:40 3차 테스트: INFP 카드 클릭 - 비전보드 편집기 이동 성공!
17:04 3️⃣ 단계: 비전보드 편집기 구현 (멀티모델 3종 동시 실행)
19:00 🥇 Composer 모델, 가장 먼저 구현 완료! (하지만 버그 발견)
20:19 🧐 AI 브라우저 테스트 및 '요소 선택' 디버깅
21:08 🐞 실시간 디버깅 #4: 멀티모델이 동시에 버그 수정 경쟁
23:06 4차 테스트: 텍스트/이미지 추가, 드래그, 리사이징 (DB 저장 X)
25:58 🐞 실시간 디버깅 #5: DB 저장 기능 누락 (치명적 버그)
31:55 4️⃣ 단계: 목표 추적기(Goal Tracker) UI 구현
32:38 5차 테스트: 목표 추가/완료 기능 (또 DB 저장 안 됨)
35:10 5️⃣ 단계: 미디어 임베드 (유튜브, 스포티파이)
35:41 🐞 실시간 디버깅 #6: 다이얼로그 UI 깨짐 문제
36:09 6차 테스트: 스포티파이, 유튜브 임베드 성공!
37:22 🏁 완성 및 결론: '바이브 워킹'이란 무엇인가
38:52 맺음말