react hooks

Class형 컴포넌트들은 상태와 관련된 로직을 재사용하기 어렵다.
Hook를 이용하여 Class를 작성할 필요 없이 상태 값과 여러 React의 기능들을 사용할 수 있다.

Hook을 사용할 때 지켜야할 두 가지 규칙이 있다.

1. 최상위(at the Top Level)에서만 Hook을 호출해야 한다
   (반복문, 조건문 혹은 중첩된 함수 내에서 Hook을 호출 X)
2. 오직 React 함수 내에서 Hook을 호출해야 한다
   (Hook을 일반적인 JavaScript 함수에서 호출X)

linter 플러그인을 설치하면 이러한 규칙들을 바로 잡아준다.(eslint-plugin-react-hooks ESLint 플러그인)

• Hook은 class 안에서는 동작 X
• 컴포넌트 간에 상태 관련 로직을 재사용하기 위해 Hook을 직접 만드는 것(custom hook)도 가능

참고 : https://ko.reactjs.org/docs/hooks-rules.html