소개
Antigravity 로 간단한 서비스를 개발해보는 것이 목표입니다. 서비스는 뭘 할까 생각하다가 수강생과 제가 만든 AI 북 큐레이션을 해보려고 합니다.
진행 방법
어떤 도구를 사용했고, 어떻게 활용하셨나요?
Gemini로 기획
Antigravity로 바이브코딩
github 버전 관리 및 저장소
Vercel 호스팅 및 배포
Google Analytics 방문자 분석
hotjar 사용자 행동 분석 (아직 연결하지 못했어요)
Tip: 사용한 프롬프트 전문을 꼭 포함하고, 내용을 짧게 소개해 주세요.
✅ Gemini 기획
먼저 gemini 에게 제가 만들고 싶은 것을 설명하고 차근차근 기획해봅니다.
이렇게 물으니 아래처럼 상세하게 기획하고 필요한 것을 질문해줍니다.
몇 단계의 질문을 거치는데요 너무 방대한 작업이 되는 것은 작게 최소로 진행하도록 합니다.
그리고 아래처럼 Antigravity 로 전달하기 위한 작업도 Gemini 에게 같은 채팅에서 지시해요.
긴 대화 끝에 최종은 아래입니다。
✅ Antigravity 바이브코딩
Gemini가 준 기획을 Antigravity 에 그대로 붙여 넣으니 Thinking...이 한참 돌아가고 Task, Implementation Plan 등이 문서로 나오고, 소스 파일도 몇개가 생겨요.
이것은 Antigravity 가 만든 Task.md 파일입니다. md 파일에 마크업으로 중간중간 필요한 가이드, 구현 상세 스펙 등을 만들어줘서 좋네요. 진행중 나오는 Accept 등은 간단한 질문을 읽어보고 다 accept 해줍니다.
완료되었다고 하는데 확인 방법을 모르겠다면 또 물어봅니다.
그래도 모르겠으면 Antigravity 에서 대화가 넘 길어지니 Gemini로 다시 가서 이 내용으로 물어봐요.
✅ Vercel 배포
Antigravity 에서 뭔가 서비스를 계속 개선하려고 해서 일단 스터디장님의 가이드대로 vercel 로 배포하고 구글 애널리틱스, hotjar 까지 연결을 시도해보려고요.
Vercel 사이트에 들어갔다가 뭔말인지 모르겠어서 Antigravity 로 다시 와서 해달라고 해요.
그럼 멋진 Antigravity 가 아래처럼 Deploy Guide.md로 가이드 문서까지 만들어주네요. 가이드 문서는 계속 작업하면서 업데이트가 됩니다.
이 과정에서 GitHub을 연동하고 Vercel 에서 다시 연결해야 하더라고요. (1주차 스터디장님의 유튜브를 다시 봤어요)
아래는 GitHub 화면입니다. 잘 모르겠다면 역시 Antigravity 나 Gemini에게 물어봅니다.
✅ Google Analystics 연동
Google Analystics에 Project를 만들고 Tag Code를 달아야 합니다. Tag Code가 나오면 Antigravity 에게 다시 시켜요.
✅ 마지막으로 Hotjar 연결
Hotjar 는 스터디때 보여준 화면하고 달라서 아직 연동하지 못했어요. Hotjar 스크립트를 추가하고 Hotjar 사이트에서 연결해야 하는거 같은데 며칠사이 웹사이트 메뉴가 바뀌었나봅니다. 요건 2주차 스터디에서 해결하기로..
그리고 Hotjar 를 연결하려고 스크립트를 추가하면 소스코드가 바뀌므로 GitHub 에 다시 올리고, Vercel 에서 다시 배포해야 합니다. 이것도 Antigravity 와 Gemini 에게 물어가면서 해요.
✅ 마지막 과정 정리도 Antigravity 에게 시켜요.
이 모든 과정에서 사용된 도구들을 정리하고 싶었어요. 그래서 전체 맥락을 알고 있는 Antigravity 에게 아래처럼 시킵니다.
그럼 역시 md 파일로 가이드 문서를 뚝딱 만들어줘요.
결과와 배운 점
https://soyuzbookanti.vercel.app/book/1
결과물 사이트입니다. 아직 갈길이 멀지만 저와 수강생이 만든 AI 사례를 여기에 큐레이션 하고 싶어요. 어쩌면 매 강의마다 Padlet 쓰는 것을 이걸로 대체할 수 있지 않을까 싶네요.
배운 점과 나만의 꿀팁을 알려주세요.
AI와 대화할때 맥락을 유지하려면 적절히 여러 AI를 사용하는 것이 유리해요. 기획은 Gemini 에게 코딩은 Antigravity 에게 배포 등은 맥락에 따라 적절히 물어보면 더 쉽습니다.
최종 정리도 Antigravity 에게 시키니 깔끔하게 정리해줍니다.
앞으로의 계획이 있다면 들려주세요.
참고한 지피터스 글이나 외부 사례를 알려주세요.
제가 이 서비스를 만들게된 자세한 내용은 아래 블로그에 다시 기록했습니다.
