REQUEST STATE

Fetch 결과는 화면 상태로 변환되어야 합니다

네트워크 요청은 response.ok 확인에서 끝나지 않습니다. 사용자가 보는 화면은 대기, 성공, 빈 결과, 실패, 취소 상태를 모두 가져야 합니다.

idle

요청 전

URL, method, headers, body, signal을 만들고 이전 요청 키와 비교합니다.

loading

대기 중

버튼 중복 클릭을 막고, 화면에는 현재 데이터가 갱신 중임을 표시합니다.

success

응답 성공

2xx 응답이면 본문을 파싱하고 최신 요청인지 확인한 뒤 상태를 반영합니다.

empty

빈 결과

정상 응답이지만 배열이 비었거나 표시할 값이 없으면 별도 안내를 표시합니다.

error

실패 처리

HTTP 오류, 네트워크 실패, AbortError를 구분해 재시도와 무시 조건을 나눕니다.

최신 요청만 반영

검색어가 바뀌면 이전 controller를 abort하고, 늦게 도착한 응답은 버립니다.

오류 메시지 분리

404, 500, CORS, 연결 실패는 원인이 달라 사용자 안내와 로그 수준도 달라집니다.

본문 파싱 보호

json 파싱 실패도 요청 실패처럼 다루고, 서버 응답 형식과 헤더를 함께 확인합니다.