2025.08.23부터 09.15까지, HLMN 어드민의 hero-images, lab, main, news feature를 리팩토링했다.
작업 목록은 이랬다. FSD 파일 구조로 변경, 케밥케이스에서 카멜케이스로 네이밍 통일, 재사용 가능한 요소 정리, 기존 버그 수정, CraeteImageForm이라는 오타 수정. 목록만 보면 단순한데, 작업하면서 리팩토링의 기준을 다시 잡게 됐다.
처음엔 케밥케이스를 카멜케이스로 바꾸는 게 당연한 작업이라고 생각했다. 그런데 기존 코드를 보니 케밥케이스를 쓴 이유가 있었다. 한 파일 안에서 부모-자식 관계의 컴포넌트를 묶기 위해서다. hero-image-list, hero-image-item 같은 식으로.
그걸 알고 나니까 회의감이 생겼다. 나름의 이유가 있는 네이밍을 카멜로 바꾸는 게 리팩토링이라 부를 작업인가. 단순히 컨벤션을 통일하는 건 리팩토링이라기보다 정리에 가깝다.
의미 있는 작업은 따로 있었다. 추가 폼과 수정 폼이 별개의 컴포넌트로 분리되어 있었는데, 코드를 비교해보니 90% 이상 동일했다. 거의 복붙 수준이었다.
하나의 컴포넌트로 통합하니까 재사용성·가독성·유지보수성이 같이 올라갔다. 수정할 때 한 곳만 고치면 된다. 네이밍 통일보다 구조를 개선해서 중복을 제거하는 작업이 리팩토링의 본질에 가깝다.
QA 과정에서 특정 포스트 디테일 페이지가 500 에러를 뱉었다. 스웨거에서 직접 쏴봐도 같은 증상. 그래서 바로 서버 담당 팀원한테 "이거 에러 나요"라고 말했는데, 돌이켜보면 절차가 없었다. 내 환경에서만 그런 건지, 다른 프론트 인원도 같은 증상인지 확인도 안 하고 던진 거다.
그리고 하나 더. 이슈를 먼저 생성하고 작업을 시작하는 습관. 이게 없으면 나중에 뭘 했는지, 왜 했는지 추적이 안 된다. 당연한 건데 안 하고 있었다.