프론트엔드
쏘카플랜 개편기
두줄요약
쏘카플랜 개편 과정에서 프론트엔드 일정 추정과 QA 대응, 레거시 개선 경험을 정리했습니다. 코로케이션과 WET 원칙으로 복잡한 화면과 도메인 로직을 단계적으로 분리했습니다.
문제 상황
- 쏘카플랜 개편에서 프론트엔드 2명이 4개 화면을 React v18, Next.js v13으로 이관·리뉴얼해야 하는 일정 압박
- 초기 예상보다 요구사항과 구현 범위가 계속 늘어나며 코드 품질 저하와 일정 오차 발생
- QA 기간에 다수의 결함이 쏟아지고, 수정이 또 다른 결함을 만드는 복잡한 상황
해결 방법
- 자주 하는 작업은 시간을 두고 관찰한 뒤 안정화된 시점에 추상화와 분리를 진행
- 코로케이션으로 페이지·도메인별 파일을 모으고, WET 원칙으로 성급한 공통화 대신 복사 후 리팩토링
- Tag UI, 도메인 hook, Context를 분리해 관심사를 나누고 결합도 낮추기
주의할 점
- DRY를 과하게 적용하면 잘못된 추상화로 오히려 복잡도 증가 가능성
- 일정 산출은 즉답보다 정확도와 측정 기반 접근이 중요
- QA 주간에는 우선순위와 To do list를 명확히 해 크런치 상황 관리 필요
