훅(HOOK) 이란?

1. 리액트 컴포넌트는 클래스형 컴포넌트(Class component)와 함수형 컴포넌트(Functional component)로 나뉩니다.
2. 리액트 훅은 새로운 기능으로 React 16.8버전에 새로 추가된 기능
3. 함수형태의 컴포넌트에서 사용되는 몇가지 기술을 Hook이라고 부릅니다. (useState, useEffect 등)
4. 리액트 훅은 함수형 컴포넌트가 클래스형 컴포넌트의 기능을 사용할 수 있도록 해주는 기능이다.

훅의 규칙

• 최상위 에서만 Hook을 호출해야 한다
  • 반복문, 조건문, 중첩된 함수 내에서 Hook을 실행하면 안된다.
  • 이 규칙을 따르면 컴포넌트가 렌더링될 때마다 항상 동일한 순서로 Hook이 호출되는 것이 보장된다.
• 리액트 함수 컴포넌트에서만 Hook을 호출해야 한다.

반드시 알아야 할 기본 훅

useState(초기값)

useState() : 배열반환 첫번째 배열의 요소에는 현재값을, 두번째 요소는 상태를 변경하는 (setter) 를 반환합니다.

const [data, setData] = useState('초기값')