유튜브블로그Top 10
내 프로필

데브허브 안내
소개업데이트 소식

데브허브 커뮤니티

You Are Using useEffect Wrong (and how to fix it)

Cosden Solutions

2025. 10. 29.

0

#frontend
  • useEffect는 React에서 가장 오해받고 어려운 훅 중 하나이며, 올바른 사용법 이해가 필수적입니다. 🤯
  • useEffect의 의존성 배열 규칙은 공식 React 문서에 명시된 필수 사항으로, 이 규칙을 무시하면 심각한 버그를 초래합니다. 📜
  • useEffect 본문 내에서 사용되는 모든 반응형 값(컴포넌트 내 정의된 함수 포함)은 반드시 의존성 배열에 포함되어야 합니다. 🔗
  • 의존성 배열에 반응형 값을 누락하면 useEffect가 오래된(stale) 값을 참조하는 '오래된 클로저' 버그가 발생하여 예상치 못한 동작을 야기합니다. 🐛
  • useState의 상태 업데이트 함수(예: setActivityCount)는 반응형이 아니므로 의존성 배열에 포함할 필요가 없습니다. 🪄
  • 컴포넌트 내에서 정의된 함수를 의존성 배열에 추가하면 매 렌더링마다 함수가 재생성되어 useEffect가 불필요하게 재실행될 수 있습니다. 🔄
  • 이러한 문제를 해결하기 위해, useEffect 내부에서만 사용되는 함수는 useEffect 본문 안에서 정의하여 의존성에서 제외할 수 있습니다. 🛠️

Recommanded Videos