💗 React Hook 규칙

✍ 1. 최상위 레벨에서만 호출해야 한다

반복문, 조건문, 중첩된 함수 내에서는 불가

✍ 2. 컴포넌트가 렌더링될 때마다 매번 같은 순서로 호출되어야 한다

잘못된 Hook 사용법

function MyComponent(props){
const [name, setName] = useState('hey');

if (name ! == '') {
  useEffect(()=> 
            ...
            }));
}
...

}
//중간에 name값이 빈배열이 되면 if문이 false가 되어 useEffect()호출이 되지 않음
//조건문의 결과에 따라 달라지므로 잘못된 코드

✍ 3. 리액트 함수 컴포넌트에서만 Hook을 호출해야 한다.

일반적인 js에는 불가능!

*eslint-plugin-react-hooks: 리액트 훅을 잘 사용하고 있는 지 알려주는 패키지