📖 지난 편 요약
rssweb이라는 이름의 RSS 피드 수집기가 FeeDraft라는 AI 초안 작성 툴로 진화한 과정, Gemini API를 선택한 이유, 그리고 수익화 방향 구상까지 — 아직 확정된 것은 아무것도 없는 현재진행형 이야기였다.
📋 이 글의 목차
기술 스택 선택 — Next.js, Vercel, Supabase
기술 스택 선택에 많은 고민을 한 건 아니었다. 고민할 이유가 없었다. 사이드 프로젝트, 혼자 개발, 초기 배포까지 무료 — 이 세 가지 조건을 걸면 선택지가 자연스럽게 좁혀진다.
개발 언어는 TypeScript. 프레임워크는 Next.js. 요즘 웹 개발에서 가장 무난하고 생산적인 선택이다. 바이브코딩과의 궁합도 좋다.
GitHub에 push하면 자동으로 배포된다. 설정할 거리가 없다는 게 가장 큰 이유였다. 초기 배포까지는 무료로 충분히 가능하다.
피드 목록, 로그인 정보 등 데이터 저장은 Supabase의 PostgreSQL. 무료 티어로 시작 가능하고 Next.js와 연동이 깔끔하다.
Vercel과 연동되어 push = 자동 배포. 작업 로그와 할 일 목록을 .md 파일로 함께 커밋해두는 습관도 생겼다.
세 가지 모두 무료로 시작 가능하고, 서로 연동이 자연스럽다. 첫 배포까지 인프라 걱정을 전혀 안 해도 된다는 게 사이드 프로젝트에서는 굉장히 중요한 포인트다. Vercel에 기록된 첫 배포 날짜는 2026년 4월 10일.
Gemini CLI를 주력으로 선택한 이유
처음 시작부터 현재까지 바이브코딩의 주된 작업 도구는 Gemini CLI였다. Claude Code나 Codex가 개발에는 더 낫다는 말을 많이 들었다. 그럼에도 Gemini를 선택한 이유는 단순하다.
Gemini CLI를 선택한 현실적인 이유
Gemini 구독 요금으로 넉넉한 사용 한도를 이미 확보해두고 있었다.
첫 시작이라 코드베이스 분석이 필요 없었다. 처음부터 짜는 거라 어떤 도구든 큰 차이가 없다고 판단했다.
그렇게 복잡한 개발 규모가 아니었다. 첫 바이브코딩 사이드 프로젝트에 비용을 추가로 쓸 이유가 없었다.
바이브코딩 방식은 단순하다. 아주 기본적인 컨셉을 담은 프롬프트로 시작해서, 첫 화면이 나오면 필요한 기능을 하나씩 붙여나간다. 처음 2~3일 작업하면 대략 구상했던 화면 윤곽이 잡힌다.
주목할 점은 생성된 코드를 단 한 줄도 직접 확인한 적이 없다는 것이다. 자주 열어본 건 작업이 진행될 때마다 함께 기록된 .md 파일뿐이다. 작업 로그와 할 일 목록이 담긴 이 파일이 오히려 전체 흐름을 파악하는 데 더 유용했다.
10일의 타임라인 — 실제로 어떻게 흘러갔나
Vercel 첫 배포일은 4월 10일, 이 글을 쓰는 시점은 4월 20일. 총 10일이다. 그런데 10일을 꼬박 개발한 건 아니다.
📅 10일 타임라인
첫 배포 완료
Vercel에 첫 번째 버전 배포. 기본 화면 구성 완료.
주말 — 작업 없음
사이드 프로젝트는 사이드 프로젝트답게.
기능 확장 및 개선
부가 기능 추가, 디자인 컨셉 교체, 테스트 반복.
⚠️ 코드 오류 배포 사고
오류가 있는 코드를 배포하는 바람에 급하게 대충 롤백. 식은땀 제대로 흘렸다.
다른 일정으로 손도 못 댐
롤백해둔 채로 3일을 보냈다.
✅ 오류 수정 후 재배포
오류 발생 이전 버전 재배포 후 작업 재개. 현재 원활하게 동작 중.
💬 실제 개발 일수는?
10일이라고 했지만 주말, 일정 공백, 사고 대응을 빼고 나면 실제로 손댄 날은 5~6일 남짓이다. 아무에게도 알려지지 않은 사이트지만 지금은 원활하게 돌아가고 있다. 사이드 프로젝트란 원래 이런 거다.
디자인 컨셉 변천사 — 4번 바뀐 스타일
처음에는 아무런 디자인 컨셉 없이 바이브코딩을 시작했다. Tailwind CSS 기본 스타일이 그냥 적용되는 대로 뒀다. 요즘 가장 흔하게 보이는 그 디자인. 그러다 design.md 파일을 만들어서 스타일을 하나씩 적용해보기 시작했다.
디자인을 바꾸는 건 생각보다 간단했다. design.md에 원하는 스타일 가이드를 기술해두고, AI에게 이 파일을 참고해서 적용하라고 지시하면 된다. 인라인 스타일이든 CSS 클래스든 원하는 방식으로 골라서 쓸 수 있다.
보안 점검 — Claude Code vs Codex vs Gemini
어느 정도 개발이 완성된 시점에 보안 점검을 진행했다. 동일한 프롬프트를 Claude Code, Codex, Gemini 세 곳에 동시에 돌렸다. 결과는 꽤 흥미로웠다.
취약점 발견 개수는 달랐지만, 중요한 건 따로 있었다. 크리티컬 취약점 2가지는 세 AI 모두 동일하게 찾아냈다. 발견 개수보다 핵심을 짚어내는 능력이 더 중요하다는 얘기다.
🔧 보안 취약점 처리 순서
세 AI 모두 공통으로 지적한 크리티컬 취약점 2가지를 먼저 처리.
Claude Code와 Codex가 공통으로 지적한 항목을 다음 순서로 처리.
각 AI별로 다르게 판단한 항목은 취사선택. 제외할 건 제외하고, 처리할 건 처리.
그리고 한 가지 흥미로운 포인트가 있다. 이 연재 전체를 통틀어 Gemini CLI를 쓰지 않은 유일한 작업이 바로 이 보안 취약점 수정 단계였다. 취약점 수정은 전부 Claude Code Sonnet 4.6으로 처리했다.
"보안 취약점을 찾는 건 Gemini도 했지만, 고치는 건 Claude에게 맡겼다. 각자 잘하는 게 따로 있다."
NEXT EPISODE · 마지막 편
4편 — "딸깍"으로 서비스 만든다는 말, 20년 개발자가 직접 해봤습니다
바이브코딩의 현실, 딸깍 신화에 대한 솔직한 시각, 비개발자 바이브코더에 대한 궁금증, 그리고 작곡가 비유까지 — 이 연재의 마지막 편에서 20년 경력의 무게로 결론을 내립니다.
CoLife
개발자 · code & life 블로그 운영
20년 가까이 개발자로 일하면서, 요즘은 AI 도구가 개발 방식을 어떻게 바꾸는지에 관심이 많습니다. 직접 바이브코딩 사이드 프로젝트를 진행하며 느낀 것들을 솔직하게 기록합니다.
📌 연재글 구독 & 공감
다음 편이 이 시리즈의 마지막입니다.
블로그 구독을 누르시면 마지막 편 업로드 시 알림을 받을 수 있습니다. 공감 ❤️ 한 번이 큰 힘이 됩니다 🙏
'Vibe Coding devlog > FeeDraft' 카테고리의 다른 글
| "딸깍"으로 서비스 만든다는 말, 20년 개발자가 직접 해봤습니다 — FeeDraft 개발일지 4편 (0) | 2026.05.01 |
|---|---|
| RSS 피드 수집기가 AI 초안 작성툴이 된 사연 — FeeDraft 개발일지 2편 (0) | 2026.04.29 |
| 블로그 쓰기 귀찮아서 앱을 만들었습니다 — FeeDraft 개발일지 1편 (0) | 2026.04.28 |
