바이브 코딩 초보 가이드: 여행 체크리스트 만들며 배우는 AI 코딩

바이브 코딩이 쉽다는 말은 많이 들었을 겁니다. AI에게 말만 하면 코딩을 해준다고요. 맞습니다. 그런데 막상 시작하려면 막막하죠. 뭘 만들어야 할지, 뭐라고 말해야 할지, 결과가 나와도 맞는 건지 모르겠으니까요.

이 글에서는 바이브 코딩 초보가 직접 프로그램을 하나 만들어봅니다. 여행 준비물 체크리스트예요. 첫 프롬프트를 보내고, 결과를 열어보고, 마음에 안 드는 부분을 고치고, 제대로 작동하는지 확인하는 과정까지 한 번에 따라 해볼 수 있습니다.

백 번 읽는 것보다 한 번 해보는 게 빠릅니다. 직접 따라 해보세요.

이 글은 2026년 7월 Windows 환경을 기준으로 작성했습니다. 화면과 기능은 이후 변경될 수 있습니다.

바이브 코딩 초보, 어디서부터 시작할까

바이브 코딩을 하려면 AI 코딩 도구가 필요합니다. 이번 글에서는 안티그래비티(Antigravity)를 사용합니다. 설치와 실행 방법은 구글 안티그래비티 사용법 글에서 다뤘으니, 처음이시라면 먼저 참고해주세요.

안티그래비티를 고른 이유는 간단합니다. 초보자가 쓰기에 가장 직관적이에요. AI가 무엇을 만들고 있는지 눈으로 볼 수 있고, 결과물도 화면에서 바로 확인할 수 있으니까요. 코드를 읽지 못해도 괜찮습니다.

안티그래비티를 실행하고, 새 폴더를 하나 만들어서 작업 폴더로 선택하세요. 저는 “여행 체크리스트”라고 이름을 지었습니다. 여러분이 원하는 대로 하시면 돼요.

여행 준비물 체크리스트, 첫 프롬프트 보내기

작업 공간에 들어왔으면 AI에게 말을 걸면 됩니다. 오른쪽 대화창에 만들고 싶은 걸 적어주세요.

뭐라고 적어야 할지 모르겠다면, 사람에게 부탁한다고 생각하면 됩니다. “이거 만들어줘”로 시작해서, 무엇을 입력할지, 어떤 결과를 보여줄지, 하지 말아야 할 것은 뭔지 말해주면 돼요.

아래는 제가 보낸 첫 프롬프트입니다.

여행 준비물 체크리스트 프로그램을 만들어줘. 카테고리별로 준비물을 입력할 수 있게 해줘. 체크박스로 챙긴 항목을 표시할 수 있어야 해. 브라우저를 새로고침해도 입력한 내용이 남아 있어야 해. 휴대폰에서도 보기 편하게 만들어줘. 내가 요청하지 않은 기능은 추가하지 마.

마지막 문장이 중요합니다. “내가 요청하지 않은 기능은 추가하지 마.” 이걸 빼면 AI가 날씨 API를 연동하거나, 짐 무게 계산기를 붙이거나, 있어 보이는 기능을 혼자 넣어버립니다. 쓸모없는 걸 만드느라 정작 필요한 게 빠지는 거죠. AI에게 일을 시킬 때, 하지 말아야 할 것을 알려주는 건 할 일을 알려주는 것만큼 중요합니다.

프롬프트를 보내면 AI가 계획서를 보여줍니다. 바로 Proceed를 누르지 말고, 계획서를 끝까지 읽어보세요. AI는 독심술사가 아닙니다. 정확히 지시하지 않으면 자기 맘대로 하는 경우가 꽤 있거든요. 항상 체크하는 습관을 들이시면 좋습니다.

계획서를 보면 NOTE와 WARNING이 나눠져 있습니다. AI가 어떤 방향으로 만들 건지, 어떤 기능은 제외할 건지 미리 알려주는 거예요. 이 내용이 내 의도와 맞는지 확인한 뒤, 괜찮다면 Proceed를 눌러서 작업을 시작하면 됩니다.

AI가 만든 결과를 직접 열어보기

Proceed를 누르면 AI가 코딩을 시작합니다. 작업이 끝나면 결과를 확인할 수 있는 주소를 알려줍니다. 주소를 클릭하면 브라우저에서 바로 열려요.

만약 주소가 안 보이거나 클릭이 안 된다면, 작업 폴더를 열고 index.html 파일을 더블클릭해도 됩니다. 이상하게 열린다면 연결 프로그램에서 Chrome을 선택하세요. 그것도 잘 모르겠다면, 대화창에 “완성된 index.html 파일을 브라우저에서 열어줘”라고 입력하면 됩니다. AI가 대신 열어줘요.

AI가 보라색 톤의 체크리스트를 만들어줬습니다. 의류, 세면도구, 전자기기, 비상약 카테고리에 기본 항목까지 넣어뒀네요. 되게 그럴싸합니다.

화면이 열리면 바로 눌러볼 게 있습니다. 준비물을 입력해보세요. 카테고리를 나눠서 넣을 수 있는지 확인합니다. 체크박스를 눌러보세요. 체크와 해제가 잘 되는지 봅니다. 브라우저를 새로고침해보세요. 입력한 내용이 남아 있어야 합니다.

핵심은 내가 요청한 것이 전부 들어갔는지 검수하는 겁니다. AI가 만들었다고 해서 무조건 믿으면 안 됩니다.

마음에 안 들면 고치면 된다

처음 나온 결과가 마음에 쏙 들 확률은 낮습니다. 디자인이 별로일 수도 있고, 원하는 기능이 빠졌을 수도 있어요. 그럴 때 처음부터 다시 만들 필요 없습니다. AI에게 바꿔달라고 하면 됩니다.

저는 보라색 테마가 마음에 안 들었고, 여행 갈 때 책도 챙기고 싶어서 이렇게 보냈습니다.

일단 일본 벚꽃풍, 핑크색 화사한 느낌이면 좋겠어. 그리고 난 여행 갈 때 책도 가져가고 싶으니까 그것도 반영해줘.

보라색이 핑크색 벚꽃 테마로 바뀌었고, 도서 카테고리가 새로 생겼습니다. “읽을 소설책”, “여행지 가이드북”까지 AI가 알아서 넣어줬네요. 이렇게 원하는 부분을 말하고, 결과를 확인하고, 다시 고치는 과정을 반복하면 됩니다. 사람은 수정을 귀찮아하지만, AI는 귀찮아도 해주니까요.

한 가지 중요한 습관이 있습니다. 수정할 때 한 번에 너무 많은 걸 바꾸지 마세요. “색상 바꾸고, 버튼 추가하고, 레이아웃 바꾸고, 애니메이션 넣어줘” 이렇게 보내면 AI가 하나를 고치다가 다른 걸 망가뜨리는 일이 생깁니다. 한두 가지씩 고치고 결과를 확인한 뒤 다음으로 넘어가세요.

내가 만든 프로그램, 진짜 되는지 확인하기

어느 정도 모양이 잡혔으면 마지막으로 전체 점검을 합니다. 코드를 몰라도 결과가 맞는지는 확인할 수 있어요. 내가 요청한 기능을 하나씩 눌러보면 됩니다.

준비물을 추가하고 삭제해보세요. 입력과 삭제가 정상적으로 되는지 봅니다. 체크박스를 눌러보세요. 체크와 해제가 잘 작동하는지 확인합니다. 카테고리를 나눠서 입력해보세요. 분류가 제대로 되는지 봅니다. 브라우저를 새로고침해보세요. 데이터가 남아 있어야 합니다. 휴대폰에서도 열어보세요. 화면이 깨지지 않는지 확인합니다.

하나라도 안 되면 안티그래비티에 돌아가서 “새로고침하면 데이터가 사라지는 문제를 고쳐줘”처럼 구체적으로 알려주세요. “안 돼”보다 “이게 안 돼”가 훨씬 잘 고쳐집니다.

검증은 거창한 게 아닙니다. 내가 요청한 기능을 하나씩 눌러보는 거예요. 이 습관이 바이브 코딩에서 가장 중요합니다.

코딩을 못해도, 기준은 세울 수 있다

이번 글에서 한 일을 정리하면 이렇습니다. 만들고 싶은 걸 정하고, AI에게 프롬프트를 보내고, 결과를 열어서 확인하고, 마음에 안 드는 부분을 고치고, 진짜 작동하는지 검증했습니다.

코드는 한 줄도 직접 쓰지 않았지만, 프로그램은 완성됐습니다. 바이브 코딩에서 사람의 역할은 코드를 쓰는 게 아니라 기준을 세우는 겁니다. 뭘 만들지, 어떻게 동작해야 하는지, 어디까지 허용할지. 이 기준이 뚜렷할수록 AI는 정확하게 움직입니다.

프로젝트가 커지면 AI가 앞에서 나눈 대화를 잊는 문제가 생기는데, 이를 해결하는 방법은 다음 글에서 다루겠습니다.

처음부터 잘할 필요 없습니다. 이번에 체크리스트를 만들면서 느낀 감각으로, 다음에는 조금 더 복잡한 걸 시도하면 됩니다. 그렇게 한 단계씩 가는 겁니다.

감사합니다.