프론트엔드 API 통신 경계

React 화면은 API 응답을 그대로 뿌리는 곳이 아니라 요청 상태, 에러, 캐시, 폼 입력을 사용자 흐름에 맞춰 정리하는 계층입니다.

프론트엔드 API 통신 경계React 화면은 API 응답을 그대로 뿌리는 곳이 아니라 요청 상태, 에러, 캐시, 폼 입력을 사용자 흐름에 맞춰 정리하는 계층입니다.
01

API 클라이언트

base URL과 공통 헤더 고정 · 토큰, Content-Type, 에러 변환을 한 곳에 모아 화면 컴포넌트를 가볍게 둡니다.

02

상태 관리

전역 상태와 서버 상태 분리 · 사용자 정보처럼 공유되는 값과 목록 조회 결과를 같은 저장소에 섞지 않습니다.

03

라우팅

페이지 단위 책임 정리 · 목록, 상세, 작성 화면은 URL과 데이터 요청 범위를 함께 설계합니다.

핵심프론트엔드 API 통신 경계은 각 요소의 관계와 선택 조건을 함께 읽어야 한다.