초기 렌더
users는 비어 있고 effect 실행 전 화면이 먼저 그려집니다.
데이터 페칭 상태 전환
fetch 코드가 성공하더라도 화면은 loading, error, data 중 하나를 선택해야 합니다. 각 상태 변수를 한 요청 단위로 함께 갱신하면 렌더 분기가 예측 가능해집니다.
요청 시작
setLoading(true)로 목록 대신 로딩 피드백을 렌더링합니다.
응답 저장
JSON 파싱 결과를 users 상태에 넣고 목록 렌더로 전환합니다.
오류 분기
네트워크나 HTTP 오류를 error 상태로 분리해 화면에 표시합니다.
render초기 화면
effect요청 시작
settle성공/실패
view분기 렌더
loading true
목록 대신 불러오는 중 메시지를 먼저 렌더링합니다.
error exists
데이터보다 오류 화면을 우선해 실패 원인을 드러냅니다.
users ready
성공 응답이 준비되면 map으로 목록 UI를 렌더링합니다.
데이터 페칭 상태 판단 기준 finally에서 loading을 끄더라도 실패 요청의 error와 성공 요청의 data는 서로 섞이지 않도록 분리해서 관리해야 합니다.