AI/AI 코딩

바이브 코딩 실전 체크리스트: 만들기 전에 정해야 할 것들

notebase 2026. 6. 1. 09:00

바이브 코딩을 시작하기 전에 정해야 할 기능, 화면, 데이터, 로그인, 보안, 테스트, 배포 기준을 실전 체크리스트로 정리했습니다. AI 코딩 도구로 프로젝트를 만들기 전 참고하기 좋습니다.

 

바이브 코딩은 AI에게 “이런 앱 만들어줘”라고 말하는 것만으로 끝나지 않는다. 실제로는 만들기 전에 무엇을 정했는지가 결과물의 품질을 거의 결정한다.

AI 코딩 도구가 좋아지면서 작은 웹앱이나 자동화 도구는 예전보다 훨씬 빠르게 만들 수 있다. Cursor, Claude Code, Codex, Gemini CLI, GitHub Copilot 같은 도구를 쓰면 코드 작성과 수정 속도는 확실히 빨라진다.

문제는 속도다.

너무 빨리 만들어지기 때문에, 처음에 기준을 정하지 않으면 나중에 어디서 꼬였는지 찾기 어려워진다. 기능은 늘어나고, 파일은 많아지고, AI는 이전 의도를 잊은 것처럼 다른 방향으로 코드를 바꾼다.

그래서 바이브 코딩을 할 때는 “코드를 어떻게 짤까?”보다 먼저 “무엇을 만들고, 어디까지 만들고, 어떤 기준으로 확인할까?”를 정해야 한다.

이 글은 바이브 코딩으로 프로젝트를 시작하기 전에 정리해두면 좋은 실전 체크리스트다.

 

바이브 코딩은 코딩보다 결정이 먼저다

바이브 코딩을 처음 하면 보통 이렇게 시작한다.

할 일 관리 앱 만들어줘.

 

AI는 바로 코드를 만들어준다. 화면도 생기고, 버튼도 생기고, 어느 정도 동작도 한다.

그런데 조금만 더 진행하면 질문이 생긴다.

할 일을 어디에 저장하지?
로그인은 필요한가?
삭제한 데이터는 복구할 수 있어야 하나?
모바일에서도 써야 하나?
혼자 쓰는 앱인가, 여러 명이 쓰는 앱인가?
API 키는 어디에 보관해야 하지?

 

이런 질문에 답하지 않은 상태에서 코드를 계속 만들면 프로젝트가 쉽게 흔들린다.

AI는 사용자의 의도를 추측해서 구현한다. 사용자가 정하지 않은 부분은 AI가 알아서 채운다. 이게 편할 때도 있지만, 실전에서는 오히려 문제가 된다.

내가 원한 구조가 아닌데 그럴듯하게 만들어지기 때문이다.

여기서 중요한 점은 바이브 코딩이 “기획 없이 개발하는 방식”은 아니라는 것이다. 오히려 기획이 짧고 선명해야 AI가 제대로 움직인다.

 

1단계: 방향 정하기

AI에게 코드를 맡기기 전에, 사람이 먼저 프로젝트의 기준선을 정하는 단계다.

처음부터 세부 기능을 전부 정할 필요는 없다. 하지만 “무엇을 만들고, 누가 쓰고, 어떤 상황에서 쓰는지”는 정해두는 편이 좋다.

이 기준이 없으면 AI가 알아서 방향을 잡는다. 문제는 그 방향이 내가 원한 방향과 다를 수 있다는 점이다.

 

1. 무엇을 만들지 한 문장으로 정하기

가장 먼저 정할 것은 프로젝트 설명이다.

긴 기획서가 아니어도 된다. 대신 한 문장으로 말할 수 있어야 한다.

좋지 않은 예시는 이런 식이다.

블로그 운영에 도움 되는 도구를 만들고 싶다.

 

너무 넓다. AI가 무엇을 만들어야 할지 추측해야 한다.

조금 더 좋은 예시는 이렇다.

티스토리 블로그 글 제목과 메타 설명을 입력하면 SEO 점검표를 만들어주는 웹앱을 만든다.

 

이 정도면 방향이 훨씬 선명해진다.

한 문장 안에는 가능하면 세 가지가 들어가면 좋다.

  • 누가 쓰는지
  • 무엇을 입력하는지
  • 어떤 결과를 얻는지

예를 들면 다음과 같다.

개발 입문자가 에러 메시지를 붙여넣으면 원인과 확인할 명령어를 알려주는 웹앱을 만든다.

 

또는 이렇게 정리할 수도 있다.

개인 사용자가 구독 서비스 이름과 결제일을 입력하면 이번 달 결제 예정 목록을 보여주는 앱을 만든다.

 

이 한 문장이 프로젝트의 기준점이 된다.

AI가 다른 방향으로 코드를 만들기 시작하면 다시 이 문장으로 돌아오면 된다.

 

2. 사용자와 사용 상황 정하기

다음은 누가, 언제, 왜 쓰는지 정해야 한다.

많은 사람이 이 단계를 건너뛴다. 하지만 이 부분을 정하지 않으면 기능이 계속 늘어난다.

예를 들어 “메모 앱”을 만든다고 해보자.

혼자 쓰는 메모 앱인지, 팀이 같이 쓰는 메모 앱인지에 따라 구조가 달라진다. 혼자 쓰는 앱이면 로그인 없이 로컬 저장만으로도 충분할 수 있다. 팀이 쓰는 앱이면 계정, 권한, 공유 기능이 필요하다.

같은 메모 앱이어도 사용 상황에 따라 완전히 다른 프로젝트가 된다.

정리할 때는 거창하게 쓰지 않아도 된다.

사용자: 개발 공부를 시작한 초보자
상황: 에러 메시지를 봤지만 어디서부터 확인해야 할지 모를 때
목적: 에러 원인 후보와 확인 순서를 빠르게 알고 싶다

 

또는 이런 식으로 정리할 수 있다.

사용자: 티스토리 블로그 운영자
상황: 글을 발행하기 전에 제목, 설명, 태그를 점검하고 싶을 때
목적: 검색 의도와 글 구조가 맞는지 확인하고 싶다

 

이 정도만 정해도 AI에게 훨씬 정확하게 지시할 수 있다.

 

2단계: 구조 설계하기

이 단계에서는 기능, 화면, 데이터, 권한 범위를 정한다.

바이브 코딩에서 프로젝트가 꼬이는 이유는 대부분 이 구간에서 나온다. 기능을 계속 추가하다가 화면 구조가 복잡해지고, 데이터 구조가 바뀌고, 로그인이나 권한 같은 무거운 기능이 뒤늦게 붙으면서 코드가 흔들린다.

처음 목표는 “작지만 끝까지 동작하는 버전”을 만드는 것이다.

 

3. 핵심 기능과 나중 기능 나누기

바이브 코딩에서 가장 흔한 실수는 처음부터 기능을 많이 넣는 것이다.

AI는 요청하면 대부분 만들어준다. 그래서 채팅창에 계속 기능을 추가하게 된다.

로그인도 넣어줘.
다크모드도 넣어줘.
관리자 페이지도 넣어줘.
엑셀 다운로드도 넣어줘.
알림 기능도 넣어줘.

 

문제는 기능이 늘어나는 속도보다 구조가 망가지는 속도가 더 빠를 수 있다는 점이다.

처음에는 핵심 기능만 정해야 한다.

예를 들어 “구독 결제 관리 앱”이라면 핵심 기능은 이 정도면 충분하다.

  • 구독 서비스 추가
  • 결제일 입력
  • 월 결제 금액 입력
  • 이번 달 결제 예정 목록 보기

반대로 아래 기능은 나중으로 미뤄도 된다.

  • 로그인
  • 통계 차트
  • 이메일 알림
  • 카드사 문자 자동 분석
  • 가족 공유
  • 다크모드

처음부터 모든 기능을 넣으려고 하면 AI가 만든 코드도 복잡해진다. 초보자 입장에서는 나중에 수정하기 더 어려워진다.

처음 버전은 작아도 된다. 대신 실제로 끝까지 동작해야 한다.

 

4. 화면 흐름 먼저 그리기

코드를 만들기 전에 화면 흐름을 정해야 한다.

디자인을 예쁘게 만들라는 뜻이 아니다. 사용자가 어떤 순서로 움직이는지만 정하면 된다.

예를 들어 간단한 SEO 점검 도구라면 화면 흐름은 이렇게 잡을 수 있다.

1. 제목 입력
2. 메타 설명 입력
3. 본문 일부 입력
4. 점검하기 버튼 클릭
5. SEO 체크 결과 표시

 

이 흐름이 없으면 AI는 화면을 마음대로 구성한다. 어떤 경우에는 입력창이 너무 많아지고, 어떤 경우에는 결과 화면이 불필요하게 복잡해진다.

처음에는 종이에 써도 되고, 메모장에 적어도 된다.

중요한 것은 화면 단위를 먼저 나누는 것이다.

홈 화면
입력 화면
결과 화면
설정 화면

 

이렇게 화면을 나누면 AI에게 작업을 시킬 때도 편하다.

먼저 입력 화면만 만들어줘.
아직 API 연결은 하지 말고, 임시 데이터로 결과 화면까지 확인할 수 있게 해줘.

 

이런 식으로 작은 단위로 요청할 수 있다.

 

5. 데이터 구조 정하기

바이브 코딩에서 데이터 구조를 대충 넘기면 나중에 수정 비용이 커진다.

예를 들어 할 일 관리 앱을 만든다고 하면 “할 일”에 어떤 정보가 들어갈지 먼저 정해야 한다.

할 일
- id
- 제목
- 완료 여부
- 생성일
- 마감일

 

처음에는 이 정도면 충분하다.

여기에 우선순위, 태그, 반복 일정, 첨부파일까지 한 번에 넣으면 구조가 복잡해진다.

블로그 SEO 점검 도구라면 데이터 구조는 이렇게 잡을 수 있다.

SEO 점검 요청
- 제목
- 메타 설명
- 본문
- 핵심 키워드
- 작성일

SEO 점검 결과
- 제목 길이 평가
- 메타 설명 평가
- 키워드 포함 여부
- 개선 제안 목록

 

이렇게 데이터 구조를 먼저 정하면 AI가 코드를 만들 때 흔들림이 줄어든다.

특히 데이터베이스를 쓰는 프로젝트라면 이 단계가 더 중요하다.

처음에는 SQLite, Supabase, Firebase, PostgreSQL 같은 선택지도 고민하게 된다. 하지만 초보 단계에서는 저장 방식보다 데이터 항목을 먼저 정하는 것이 더 중요하다.

저장소는 나중에 바꿀 수 있지만, 데이터 구조가 계속 바뀌면 전체 코드가 흔들린다.

 

6. 로그인과 권한 범위 정하기

로그인은 생각보다 무거운 기능이다.

“그냥 로그인 붙여줘”라고 하면 AI가 코드를 만들어줄 수는 있다. 하지만 실제 서비스 관점에서는 계정 생성, 비밀번호 저장, 세션, 토큰, 로그아웃, 권한 확인, 개인정보 처리까지 이어진다.

혼자 쓰는 도구라면 처음부터 로그인이 필요 없을 수 있다.

예를 들어 로컬에서만 쓰는 블로그 제목 점검 도구라면 로그인 없이 시작해도 된다. 반대로 여러 사용자가 각자의 데이터를 저장해야 하는 앱이라면 로그인이 필요하다.

시작 전에 아래 질문에 답해보면 좋다.

이 앱은 나 혼자 쓰는가?
다른 사용자도 쓰는가?
사용자별로 데이터를 분리해야 하는가?
관리자 권한이 필요한가?
민감한 정보를 저장하는가?
API 키나 토큰이 필요한가?

 

여기서 “민감한 정보”가 들어가면 더 조심해야 한다.

비밀번호, API 키, 결제 정보, 개인 연락처, 업무 문서 같은 데이터는 AI가 만든 코드를 그대로 믿고 저장하면 위험하다.

API 키나 비밀번호가 필요한 프로젝트라면 처음부터 AI에게 이렇게 요구하는 편이 좋다.

API 키, 비밀번호, 토큰 같은 민감한 값은 코드에 직접 쓰지 말고 .env 환경 변수로 분리해줘.
.env 파일은 Git에 올라가지 않도록 .gitignore에 추가해줘.

 

처음 바이브 코딩 실습이라면 민감한 정보를 다루지 않는 프로젝트로 시작하는 편이 좋다.

 

3단계: 실행과 검증 준비하기

이 단계에서는 AI에게 어떤 순서로 일을 맡길지, 무엇을 성공 기준으로 볼지 정한다.

바이브 코딩은 빠르게 만들 수 있다는 장점이 있다. 하지만 빠르게 만든 만큼 검증 기준이 없으면 “일단 돌아가는 것처럼 보이는 코드”에서 멈추기 쉽다.

AI에게 한 번에 많이 시키기보다, 작게 나누고 확인하면서 진행하는 편이 안전하다.

 

7. AI에게 줄 작업 단위 쪼개기

AI 코딩 도구를 쓸 때는 요청을 작게 나눠야 한다.

한 번에 이렇게 요청하면 결과가 흔들리기 쉽다.

구독 관리 앱 전체를 만들어줘. 로그인, DB, 통계, 알림, 배포까지 다 해줘.

 

겉보기에는 빠르지만, 실제로는 검토하기 어렵다.

더 좋은 방식은 작업을 단계별로 나누는 것이다.

1단계: React로 기본 화면만 만들어줘. 데이터는 임시 배열을 사용해.
2단계: 구독 항목 추가와 삭제 기능을 붙여줘.
3단계: localStorage에 저장되게 해줘.
4단계: 월 결제 합계를 계산해줘.
5단계: 코드 구조를 컴포넌트 단위로 정리해줘.

 

이렇게 나누면 각 단계에서 확인할 수 있다.

AI에게 줄 지시문에는 “하지 말아야 할 것”도 넣는 것이 좋다.

아직 로그인은 만들지 마.
아직 서버 API는 연결하지 마.
디자인보다 기능 동작을 먼저 확인할 수 있게 해줘.
기존 파일 구조는 유지해줘.
수정한 파일 목록을 마지막에 정리해줘.

 

바이브 코딩은 AI에게 많이 맡기는 방식이지만, 방향은 사람이 잡아야 한다.

 

8. 테스트 기준 정하기

AI가 만든 코드는 그럴듯하게 보일 때가 많다.

하지만 그럴듯한 코드와 제대로 동작하는 코드는 다르다. 그래서 만들기 전에 테스트 기준을 정해야 한다.

테스트라고 해서 처음부터 복잡한 자동화 테스트를 말하는 것은 아니다. 최소한 사용자가 직접 확인할 시나리오는 있어야 한다.

예를 들어 구독 관리 앱이라면 이렇게 정할 수 있다.

구독 서비스를 추가하면 목록에 표시된다.
금액을 입력하면 월 합계에 반영된다.
삭제 버튼을 누르면 목록에서 사라진다.
새로고침해도 데이터가 유지된다.
빈 값을 입력하면 저장되지 않는다.

 

이 정도만 있어도 AI가 만든 결과물을 확인하기 쉬워진다.

에러 상황도 미리 정해야 한다.

금액에 문자를 입력하면 어떻게 할 것인가?
결제일을 비워두면 어떻게 할 것인가?
같은 이름의 구독 서비스를 두 번 추가할 수 있는가?

 

이 질문을 하지 않으면 AI가 임의로 처리한다.

실제로는 이런 작은 예외 처리가 앱의 완성도를 좌우한다.

 

9. 배포와 유지보수 기준 정하기

처음부터 배포까지 생각할 필요가 없다고 느낄 수 있다.

하지만 어디에서 실행할지는 미리 정하는 것이 좋다.

예를 들어 개인용 웹앱이라면 다음 선택지가 있다.

  • 내 컴퓨터에서만 실행
  • GitHub Pages에 정적 페이지로 배포
  • Vercel이나 Netlify에 배포
  • 서버와 데이터베이스까지 연결해 배포

각 선택지에 따라 구현 방식이 달라진다.

정적 페이지로 배포할 앱이라면 서버 기능을 넣으면 안 된다. 반대로 사용자별 데이터 저장이 필요하다면 백엔드나 외부 데이터베이스가 필요할 수 있다.

유지보수 기준도 정해야 한다.

내가 직접 코드를 읽고 수정할 수 있어야 하는가?
AI에게 계속 맡길 것인가?
파일 구조를 단순하게 유지할 것인가?
기능 추가보다 안정성을 우선할 것인가?

 

바이브 코딩으로 만든 프로젝트는 초반 속도가 빠르다. 하지만 구조가 복잡해진 뒤에는 사람이 이해하기 어려워질 수 있다.

그래서 작은 프로젝트일수록 파일 구조와 기능 범위를 단순하게 유지하는 것이 좋다.

 

바이브 코딩 시작 전 체크리스트

아래 항목을 채운 뒤 AI 코딩 도구를 시작하면 결과물이 훨씬 안정적이다.

구분 정해야 할 것 예시
프로젝트 정의 무엇을 만들 것인가 블로그 제목 SEO 점검 도구
사용자 누가 쓰는가 티스토리 블로그 운영자
사용 상황 언제 쓰는가 글 발행 전 제목과 설명을 점검할 때
핵심 기능 반드시 필요한 기능 제목 입력, 메타 설명 입력, 점검 결과 표시
제외 기능 지금 만들지 않을 기능 로그인, 통계, 자동 발행
화면 흐름 어떤 순서로 쓰는가 입력 → 점검 → 결과
데이터 구조 어떤 정보를 저장하는가 제목, 설명, 본문, 키워드
저장 방식 어디에 저장하는가 처음에는 localStorage
권한 로그인이나 관리자 기능이 필요한가 개인용이면 로그인 제외
보안 기준 민감한 값을 어떻게 관리할 것인가 API 키는 .env로 분리
테스트 기준 무엇이 되면 성공인가 입력값에 따라 결과가 표시됨
배포 방식 어디에서 실행할 것인가 로컬 실행 또는 Vercel 배포

 

이 표를 그대로 복사해서 프로젝트마다 채워도 된다.

핵심은 거창한 문서를 만드는 것이 아니다. AI가 마음대로 추측하지 않도록 최소한의 기준을 정해두는 것이다.

 

AI에게 처음 줄 프롬프트 예시

아래는 바이브 코딩을 시작할 때 사용할 수 있는 첫 프롬프트 예시다.

특히 API 키나 토큰이 필요한 프로젝트라면, 보안 조건을 프롬프트에 처음부터 넣어두는 것이 좋다. 나중에 고치려고 하면 이미 코드 곳곳에 민감한 값이 섞여 있을 수 있다.

나는 티스토리 블로그 운영자를 위한 간단한 SEO 점검 웹앱을 만들고 싶다.

목표:
- 글 제목, 메타 설명, 핵심 키워드를 입력하면 기본 점검 결과를 보여준다.
- 처음 버전에서는 로그인, 서버, 데이터베이스는 만들지 않는다.
- 데이터는 브라우저 localStorage에만 저장한다.

사용자:
- 티스토리 블로그 글을 직접 작성하는 개인 운영자

핵심 기능:
1. 제목 입력
2. 메타 설명 입력
3. 핵심 키워드 입력
4. 점검하기 버튼
5. 제목 길이, 메타 설명 길이, 키워드 포함 여부를 결과로 표시
6. 최근 점검 기록 5개 저장

제외할 기능:
- 로그인
- 서버 API
- 자동 글 생성
- 티스토리 자동 업로드
- 결제 기능

보안 조건:
- API 키, 비밀번호, 토큰 같은 민감한 값은 코드에 직접 넣지 않는다.
- 민감한 값이 필요해지는 경우 .env 환경 변수로 분리한다.
- .env 파일은 Git에 올라가지 않도록 .gitignore에 추가한다.

요청:
- 먼저 React 기준으로 화면과 기본 동작을 만들어줘.
- 디자인은 단순해도 된다.
- 한 파일에 너무 많은 코드가 몰리지 않게 컴포넌트를 나눠줘.
- 수정한 파일 목록과 실행 방법을 마지막에 정리해줘.

 

이렇게 요청하면 AI가 추측해야 할 부분이 줄어든다.

처음부터 “멋진 서비스처럼 만들어줘”라고 하는 것보다 훨씬 낫다.

 

주의할 점: AI가 만든 코드를 그대로 믿지 않기

바이브 코딩은 빠르지만, 검토가 필요 없는 방식은 아니다.

AI는 존재하지 않는 패키지를 추천할 수 있고, 오래된 문법을 섞을 수 있다. 보안상 위험한 코드를 자연스럽게 넣을 때도 있다. 에러가 나면 원인을 정확히 고치기보다 우회하는 코드를 만들기도 한다.

특히 아래 항목은 반드시 확인해야 한다.

  • 설치하라는 패키지가 실제로 존재하는지
  • 비밀번호나 API 키가 코드에 직접 들어가지 않았는지
  • .env 파일이 Git에 올라가도록 되어 있지 않은지
  • 파일 삭제, DB 초기화 같은 위험한 명령이 포함되지 않았는지
  • 로그인이나 인증 코드가 너무 단순하게 처리되지 않았는지
  • 에러를 숨기기만 하고 실제 원인을 해결하지 않은 것은 아닌지

개발 초보자라면 더더욱 작은 단위로 실행하고 확인해야 한다.

AI가 “완성했습니다”라고 말해도 실제로 완성된 것은 아니다. 실행해보고, 눌러보고, 이상한 값을 넣어봐야 한다.

 

작은 프로젝트부터 시작하는 게 좋다

바이브 코딩을 실전에서 익히려면 처음부터 큰 서비스를 만들기보다 작고 명확한 도구가 좋다.

예를 들면 이런 주제가 적당하다.

  • 블로그 제목 점검 도구
  • 구독 결제일 관리 앱
  • 간단한 할 일 관리 앱
  • CSV 파일 정리 도구
  • 에러 메시지 기록 노트
  • 독서 기록 관리 앱
  • 운동 기록 체크 앱

공통점은 기능이 작고, 데이터 구조가 단순하고, 민감한 정보를 많이 다루지 않는다는 점이다.

처음부터 결제, 로그인, 관리자 페이지, 실시간 채팅, 복잡한 권한 기능이 들어가는 프로젝트는 피하는 편이 좋다.

AI가 코드를 만들어줄 수는 있지만, 문제가 생겼을 때 사용자가 이해하기 어렵다.

 

마무리

바이브 코딩은 아이디어를 빠르게 결과물로 바꾸는 데 유용하다. 하지만 만들기 전에 아무것도 정하지 않으면 AI가 프로젝트의 방향까지 대신 정해버린다.

실제로 중요한 것은 프롬프트를 화려하게 쓰는 것이 아니다.

무엇을 만들지, 누구를 위한 것인지, 어디까지 만들지, 어떤 기준으로 확인할지를 먼저 정하는 것이다.

처음에는 작은 기능 하나만 제대로 동작하게 만드는 것이 좋다. 그다음 기능을 추가해도 늦지 않다.

바이브 코딩을 실전에서 쓰고 싶다면, 코드를 요청하기 전에 체크리스트부터 채워보는 편이 낫다. 그 10분이 나중에 몇 시간짜리 수정 작업을 줄여준다.