현직 개발자가 알려주는 바이브코딩의 체계

2026-09-20 라이브 · 2시간 12분 · 다시보기

화이트보드 왼쪽 끝에 "노베이스", 오른쪽 끝에 "바이브코딩 성공"을 적고 그 사이를 다섯 칸으로 채웠어요. 스캐폴딩, 도메인 스토리텔링, 구현, 주변 환경 보강, 브라우저 자동화. 칸마다 사람이 직접 정할 것과 AI에게 넘길 것을 가르고, 운동 앱 Mofit의 설계도 한 장을 끝까지 따라가요.

이 노트를 읽고 나면 할 수 있는 것

1. 새 프로젝트를 시작하기 전에 구현 방식·기술 스택·인프라 세 가지를 직접 정하고, 그 설계도를 AI에게 검토받기
2. 기획서를 쓰는 대신 AI가 나를 인터뷰하게 해서 문제 상황을 넘기기
3. 구현 주변에 품질 게이트를 깔고, 코드 밖 설정 업무는 브라우저 자동화로 AI에게 맡기기

목차

• 성공의 정의와 다섯 단계 ▶ 0:01:18
• 1단계 스캐폴딩 ① 웬만하면 웹으로 ▶ 0:04:04
• 1단계 스캐폴딩 ② 모든 코드를 타입스크립트로 ▶ 0:15:00
• 서버는 따로, 저장소는 하나로 ▶ 0:28:49
• 1단계 스캐폴딩 ③ 배포할 곳 정하기 ▶ 0:33:12
• 설계도를 AI에게 검토받기 ▶ 0:46:15
• Supabase는 DB로만 ▶ 0:58:05
• 2단계 도메인 스토리텔링 — 기획서 대신 인터뷰 ▶ 1:13:43
• 3·4단계 구현과 주변 환경 보강 ▶ 1:38:43
• 5단계 코드 바깥 업무는 브라우저 자동화로 ▶ 1:49:38
• Q&A ▶ 1:31:32
• 오늘 해볼 것 ▶ 1:55:05

성공의 정의와 다섯 단계 ▶ 0:01:18

바이브코딩으로 이루고 싶은 건 사람마다 달라요. 업무 자동화, 포트폴리오, 수익화 서비스, 회사 프로젝트. 이번 라이브에서는 돈 버는 법은 다루지 않고, 개발적으로 흠 없이 만드는 것을 성공으로 정의했어요 ▶ 0:03:16.

오늘 라이브를 보고 나서 고수가 되지는 않지만, 내가 뭘 모르고 있는지는 확실히 알 수 있게 될 거예요. ▶ 0:01:45 각 단계를 잘 해내는 데 필요한 지식은 따로 공부해야 하고, 이 라이브는 지도만 그려요.