`API 언제 나오나요?` 로 부터 독립하기

간단 소개

API 불확실성 속에서 UI 컴포넌트의 독립성을 확보하고 유지보수성을 높이기 위해 Adapter 레이어를 도입한 경험을 공유합니다.

AI Summary

문제 상황: API가 확정되지 않은 상황에서 프론트엔드 개발 시 API 응답 모델 예측의 어려움과 그로 인한 리팩토링 부담 발생
- 예측 데이터와 실제 API 데이터 간 불일치 (데이터 구조, 필드명, 데이터 타입 등)
- UI 컴포넌트 개발의 API 의존성 심화
해결 방법: API 레이어와 UI 컴포넌트 사이에 Adapter 레이어(Factory) 추가
- RTK Query를 사용하여 API 호출 및 데이터 변환 로직을 Factory 레이어에 집중
- UI 컴포넌트는 필요한 데이터만 prop으로 전달받아 화면 렌더링에 집중
- API 변경에 따른 UI 컴포넌트 수정 최소화 및 테스트 코드 안정화
기대 효과: UI 컴포넌트의 API 독립성 확보, 유지보수성 향상, 테스트 용이성 증대
- 로깅, userAgent 분기 처리 등 추가적인 관심사 분리 가능
- BFF와 유사한 구조로 프론트엔드 개발 효율성 증대