AI BriefingRTK Query 기반 API 어댑터 레이어로 미확정 API 대응
·2022.12.08 09:00
핵심 내용
API 응답 모델이 확정되지 않은 초기 단계에서 어댑터 레이어를 도입해 UI 컴포넌트의 변경을 최소화하는 전략을 소개한다.
자세히 보기
프론트엔드 개발 시 API 스펙이 확정되지 않은 상황에서 UI를 개발하면, 실제 API가 공개될 때 필드명, 데이터 구조, 타입 불일치 등으로 인해 대대적인 리팩토링이 필요하다. 이를 해결하기 위해 RTK Query를 활용해 API 레이어와 UI 컴포넌트 사이에 Adapter(Factory) 레이어를 추가하는 방식을 제안한다.
어댑터 레이어의 역할
이 레이어는 BFF(Backend For Frontend)와 유사한 구조로, API 응답의 복잡성을 UI로부터 격리한다. API가 변경되더라도 수정은 Factory 내부의 매핑 로직에만 국한되며, UI 컴포넌트는 화면 렌더링에 필요한 단순화된 props만 전달받는다.
주요 이점
- UI 독립성: API 필드명(snake_case vs camelCase), 중첩 구조, LIVE/VOD 데이터 분리 등 백엔드 스펙 변화가 UI 코드에 영향을 주지 않는다.
- 테스트 용이성: UI 컴포넌트가 API 의존성을 제거하므로 초기 단계에서도 테스트 코드를 확정할 수 있다.
- 로직 위임: 로깅 데이터 생성이나 User-Agent 분기 처리 등 부가 로직을 Factory에 위임하여 UI 컴포넌트를 간결하게 유지한다.
이 한국어 요약은 AI가 자동으로 만들었습니다. 원문의 주장과 맥락은 원문에서 확인해 주세요. 저작권은 원저작자에게 있습니다.
