3개월 묵힌 '코드 폭탄', Claude Code로 해체 시작!
코드 폭탄
지금까지 제가 Claude Code로 개발했던 AnnotateShot(스크린샷에 주석을 추가하는 웹 서비스)가 겪고 있는 가장 큰 문제는 '코드 폭탄'이었습니다. 제가 요청하는 작업들을 무지성(?)으로 코드를 추가만 하다 보니 계속 길어지는 것이죠. 이걸 모놀리식(Monolithic) 코드라고들 합니다. 하나의 파일에 3천 라인 전후로 있는 것은 결코 확장성 측면에서 좋지 않았습니다. 기능을 하나 추가하려고 해도 높은 결합도로 인해서 사이드 이펙트가 계속 발생했죠.
업데이트 중단의 사유
Claude Code로 한창 개발을 했던 시기에서 딱 멈췄던 이유는 바로 기능 추가를 할 때마다 나왔던 사이드 이펙트 때문이었습니다. 그래서 3개월 전인 2024년 8월 21일에 멈추게 되었습니다.
당시 정말 하고 싶었던 것 중 하나가 '코드 폭탄'을 해체하는 리펙토링이었는데, 첫 시도에서 제대로 동작하지 않았습니다. 비개발자였던 터라 리펙토링 결과물을 검증하면서 진행하는 것 자체가 어려웠고, 시작부터 워킹하지 않아서 "좀 쉬자"라는 생각에 한동안 업데이트가 없었습니다.
코드 폭탄 해제할 결심
최근 Gemini 3.0, GPT-5.1 등 새로운 모델들이 나오면서, 체감할 만한 변화가 있을 것이라고 기대했습니다. 오늘 Claude Code에게 리펙토링 계획을 세워달라고 요청했습니다. 모듈화를 통해 문제를 해결할 수 있을 것이라는 답변이 왔지만, 이번에는 믿어도 될지 솔직히 의심스러웠습니다. 하지만 일단 믿고 가보기로 했습니다.
Phase1 결과
Phase 1이 완료되었습니다. 테스트가 두렵기도 했지만 localhost로 접속해서 핵심 기능 8가지를 테스트해 봤습니다.
결과는 놀라웠습니다. 7개 항목이 이상 없이 동작했고, 1개만 문제가 있었습니다. 그것도 중요하지 않은 기능이었던 다국어 스위칭 시 즉시 반영되지 않고 새로고침 후 표시되는 문제였습니다. 이 문제도 몇 번의 대화로 해소했고, 곧바로 서비스에 반영했습니다.
리펙토링 전 index.html은 3천 라인이 넘었는데, 이제는 훨씬 가볍고 관리하기 쉬운 구조가 되었습니다.
Tip
Claude Code는 긴 대화 히스토리를 모두 기억하지 못하기 때문에 claude.md를 사용하는 것을 많이 권장합니다.
저는 다른 방식을 사용합니다. 하나의 작업을 완료하고 잔여 작업이 있을 때 Claude에게 GitHub Issues로 남겨달라고 요청합니다. 그러면 Claude가 자신이 다음에 작업할 때 잘 이해할 수 있을 정도로 자세하게 이슈를 작성해 줍니다.
앞으로 계획
Phase2는 Core 모듈(main.js)을 모듈화 하는 것입니다. Phase3는 성능 최적화(메모리 사용량 등)를 진행하는 것입니다. 지금 당장 다음 단계로 넘어갈 계획은 아닙니다.
일단 이슈로 등록해 두고, Phase 1이 정말로 안정적인지 며칠간 검증한 후 다음 단계를 진행할 예정입니다.
시간이 지날수록 AI 코딩 도구들이 정말 오류 없이 척하면 척으로 대응해 주네요. 3개월 전과 비교하면 확실히 달라진 느낌입니다. 놀랍습니다.