바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

AI가 만든 코드를 바로 배포하면 안 됩니다.  
주방에서 나온 음식을 손님 테이블에 올리기 전에 맛을 봐야 합니다.
그리고 AI가 만든 코드는 직접 실행해봐야 합니다.
코드를 만든 사람 눈으로 보면 문제가 잘 안 보입니다.  
손님 입장에서 음식을 먹어봐야 진짜 문제가 드러납니다.  
사용자 시나리오 테스트가 그 역할을 합니다.

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

---

로컬 실행

로컬 실행은 내 컴퓨터에서 직접 코드를 돌려보는 것입니다.  
배포 전에 문제를 찾는 가장 기본적인 단계입니다.
실행 방법을 모를 때는 AI에게 직접 묻습니다.

 

단계	설명
환경 준비	AI가 알려준 실행 명령어를 터미널에 그대로 입력합니다.
브라우저 확인	localhost 주소를 열어 화면이 뜨는지 확인합니다.
직접 눌러보기	버튼, 입력창, 링크를 하나씩 눌러보며 반응을 확인합니다.

 

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

 

항목	확인 방법
콘솔 에러	브라우저 개발자 도구 > Console 탭 확인
네트워크 오류	개발자 도구 > Network 탭에서 빨간 항목 확인
모바일 화면	개발자 도구 > 기기 아이콘으로 모바일 뷰 확인

 

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

---

체크리스트

코드는 돌아가는데 정작 내가 원한 기능이 빠져있거나 엉뚱한 결과가 나올 수 있습니다.
배포 전 체크리스트가 그 역할을 합니다.

항목을 직접 만들기 어려우면 AI에게 요청합니다.

이 코드를 배포하기 전에 확인해야 할 테스트 항목을 체크리스트 형식으로 만들어 주세요.

 

 

분류	확인 항목
기능	핵심 기능이 정상 작동하는가
	버튼, 입력, 제출이 모두 반응하는가
화면	PC와 모바일 화면이 깨지지 않는가
오류	콘솔에 빨간 에러가 없는가
데이터	입력한 데이터가 정상 저장·출력되는가
속도	페이지 로딩이 지나치게 느리지 않은가
예외	빈 값이나 잘못된 입력을 넣었을 때 앱이 멈추지 않는가

 

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

---

사용자 시나리오

실제 사용자가 앱을 쓰는 순서를 그대로 따라 해 보는 것입니다.  
기능 단위가 아니라 흐름 단위로 테스트합니다.

시나리오를 직접 만들기 어려우면 AI에게 요청합니다.

이 앱의 주요 사용자가 겪을 수 있는 사용 시나리오 3가지를 단계별로 작성해 주세요.

 

 

단계
사용자 정의	이 앱을 쓸 사람이 누구인지 정합니다.
목표 정의	그 사람이 앱에서 무엇을 하려는지 적습니다.
순서 작성	첫 화면 진입부터 목표 달성까지 단계를 나열합니다.
직접 수행	작성한 순서를 처음부터 끝까지 직접 따라합니다.

 

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

 

사용자	목표	흐름
처음 방문한 사람	회원가입 후 첫 글 작성	홈 > 회원가입 > 로그인 > 글쓰기 > 제출
재방문 사용자	이전 글 수정	로그인 > 내 글 목록 > 수정 > 저장

 

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기

 

---

핵심 개념 4가지

웹사이트 구조를 식당에 비유합니다.

 

핵심 개념
프로트엔드와 백앤드	매장과 주방
상태	손님 상황
DB와 API	대형 냉장고와 배달 기사
에러로그	문제 기록장

 

[AI] - 바이브 코딩 시작 전 꼭 알아야 할 핵심 개념 4가지

바이브 코딩 시작 전 꼭 알아야 할 핵심 개념 4가지

 

---

AI에게 첫 주문 넣기

이제는 AI 요리사에게 직접 첫 주문을 할 차례입니다.

[AI] - 바이브 코딩 프롬프트 작성법 AI에게 첫 주문 넣기

바이브 코딩 프롬프트 작성법 AI에게 첫 주문 넣기

 

---

재주문하기

주문했는데 음식이 잘못 나왔다면 상황에 맞게 피드백을 주어야 합니다.

[AI] - 바이브 코딩 디버깅 AI에게 재주문하는 법

바이브 코딩 디버깅 AI에게 재주문하는 법

 

---

AI가 헷갈리기 시작할 때 새 주문 넣는 법

AI와 오래 대화를 나누다 보면 똑같은 실수를 반복할 때가 있습니다.
그럴 때 새 대화방을 열어 새 주문을 넣어야 할 타이밍이 있습니다.

 

[AI] - 바이브 코딩 문맥 초기화 AI가 헷갈리기 시작할 때 새 주문 넣는 법

바이브 코딩 문맥 초기화 AI가 헷갈리기 시작할 때 새 주문 넣는 법

 

---

요약

1. 직접 로컬 실행
2. 체크리스트
3. 사용자 시나리오

 

바이브 코딩 테스트 방법 AI가 만든 음식 맛보기