AI가 만든 코드가 API 요청을 무한 반복해요
AI가 만든 React 코드가 API 요청을 반복할 때 effect와 상태 변경의 순환 여부를 확인하는 가이드입니다.
빠른 답변
useEffect가 실행될 때 변경한 상태가 다시 의존성으로 평가되는지 확인합니다. 의존성 배열을 삭제해 경고를 숨기지 말고, effect가 외부 시스템과 동기화하는지 먼저 구분합니다.
- 적용 범위
- 이 가이드의 시작 증상과 각 분기 조건이 일치하는 경우문맥: 바이브 코딩
- 출처
- React
- 출처 확인일
- 2026-08-04
- 최종 검토
- 2026-08-04
- 수정일
- 2026-08-04
- 정정 이력
- 2026-07-29 이후 기록 없음
- 대상
- 사이트 운영자, 웹 에이전시, 프리랜서
이 가이드가 맞는 경우
- 애플리케이션 오류 메시지
- 성능 저하
상황별 다음 단계
호스팅사·개발자에게 전달할 내용
변경 전 기록
- 반복되는 URL, 요청 간격, 브라우저 네트워크 로그를 기록합니다.
- effect의 의존성 값과 setState 호출 위치를 확인합니다.
- 토큰·쿠키·개인정보는 전달하지 않습니다.
알아둘 점
확인 순서
- 같은 API 요청이 반복되는 간격과 횟수를 기록합니다.
- 해당
useEffect의 의존성 값이 이전 실행 전후에 어떻게 바뀌는지 비교합니다. - effect 안의
setState가 의존성 값을 직접 또는 간접적으로 변경하는지 확인합니다. - 함수·객체·배열을 렌더링마다 새로 만들고 의존성에 넣었는지 확인합니다.
- 조건이 일치하면 React useEffect가 상태 변경 때문에 무한 반복 실행됨을 확인합니다.
Strict Mode에서 개발 중 effect가 추가로 실행되는 현상과 실제 무한 반복은 구분해서 기록해야 합니다. 서버 rate limit을 해제하거나 의존성 배열을 비우는 방식으로 끝내지 마십시오.
참고 자료
useEffect | React (새 창에서 열림)
React · 공식 자료 · 확인 범위: effect가 상태를 갱신하고 그 상태가 의존성을 바꾸면 effect가 반복되는 순환이 생길 수 있습니다., React는 effect를 외부 시스템과 동기화해야 할 때 사용하고 필요하지 않다면 제거하는 방법을 안내합니다. · 확인일: 2026-08-04