Claude Code와 함께한 3주간의 Vibe Coding, 그리고 그로부터 배운 점

저는 사이드 프로젝트에 Claude Code를 활용하여 약 3주 동안 Vibe Coding (바이브 코딩)을 시도해 보았는데, 그 결과는 예상보다 더 엉망이었습니다. 사용할 수 없는 수준은 아니지만, 그저 더 지저분해졌을 뿐입니다.

최근 Juejin(쥐진)에서 홍보되는 내용은 Cursor나 Claude Code에 한 줄의 설명만 전달하면 작동하는 앱을 가지고 떠날 수 있다는 것입니다. 저의 경우, Claude Code에게 홈랩 (homelab) 전력 사용량을 추적하기 위한 작은 대시보드를 만들어 달라고 요청했습니다. Claude Code는 Next.js 프로젝트를 생성하고, 저장소로 Postgres를 선택했으며, Tailwind를 연결하고, 심지어 Grafana 임베드까지 추가했습니다. 처음 이틀 동안 저는 TypeScript 코드를 단 한 줄도 쓰지 않았습니다. 그 부분은 정말 마법처럼 느껴졌습니다.

그러다 기능을 추가하기 위해 다시 돌아갔을 때, 균열이 나타나기 시작했습니다. 에이전트 (agent)가 코드베이스 전체에 걸쳐 세 가지의 서로 다른 에러 핸들링 (error-handling) 패턴을 생성해 놓은 것이었습니다. API 라우트 중 두 개는 fetch를 직접 사용하고 있었고, 하나는 실패 시 재시도(retry)를 전혀 하지 않는 커스텀 클라이언트를 통해 작동하고 있었습니다. 이 중 어느 것도 그 자체로 틀린 것은 아니었지만, 코드를 다시 읽는 것은 마치 서두르던 낯선 사람으로부터 프로젝트를 물려받은 듯한 기분이었습니다. 제가 직접 작성했다면 아마 한 시간 정도면 끝났을 일들을 해결하느라 토요일 전체를 다 써버렸습니다.

결국 저를 구해준 것은 엄격한 규칙을 담은 CLAUDE.md 파일을 추가하는 것이었습니다: 하나의 에러 핸들링 패턴, 하나의 폴더 구조, 질문 없이 새로운 의존성 (dependencies) 추가 금지. 그 이후로 출력 품질이 눈에 띄게 향상되었습니다. 제가 얻은 교훈은, Vibe Coding은 제약 사항을 미리 설정해 두었을 때 작동하며, AI를 당신의 취향을 스스로 파악할 계약업자처럼 대하는 순간 무너진다는 것입니다. 다만, 여러 명의 에이전트와 사람이 동일한 파일을 편집하는 팀 단위의 코드베이스에서도 이것이 확장 가능할지는 확신할 수 없습니다. 그 부분은 여전히 해결되지 않은 과제로 느껴집니다.