React useEffect 무한 호출되는 문제 해결 방법

📌 문제 상황

React에서 useEffect 사용 시

👉 계속 반복 실행되는 문제가 발생

---

📌 잘못된 코드

useEffect(() => {
  setCount(count + 1);
});

👉 렌더링 → state 변경 → 다시 렌더링 → 반복

---

📌 원인

👉 의존성 배열(dependency array) 미설정

---

✅ 해결 방법

useEffect(() => {
  setCount(count + 1);
}, []);

👉 최초 1회만 실행

---

❗ 특정 값 변경 시 실행

useEffect(() => {
  console.log(count);
}, [count]);

👉 count 변경 시만 실행

---

🔥 추가 팁

• useEffect는 렌더링 이후 실행
• 의존성 배열 없으면 무한 실행 가능

---

📌 마무리

useEffect 문제는 대부분

👉 의존성 배열 설정 문제

이것만 제대로 설정하면 해결된다.