Hooks

규칙 1: 최상위(at the top level)에서만 Hook을 호출해야 합니다. 그리고 반복문, 조건문, 중첩된 함수 내에서 Hook을 실행하지 마세요

규칙 2 : React 함수 컴포넌트 내에서만 Hook을 호출해야 합니다. 일반 JavaScript 함수에서는 Hook을 호출해서는 안 됩니다. (Hook을 호출할 수 있는 곳이 딱 한 군데 더 있습니다. 바로 직접 작성한 custom Hook 내입니다. 이것에 대해서는 나중에 알아보겠습니다.)

How to use useState

const [state, setState] = useState(initialState);

setState(newState + 1); // setState와 동일하게 비동기 업데이트
setState(prev => prev + 1)

How to use useEffect

useEffect(() => {
	console.log("componentDidUpdate")
})

useEffect(() => {
	console.log("componentDidMount")
	return () => console.log("componentWillUnmount")
}, [])

useEffect(() => {
	console.log("componentDidMount")
	console.log("componentDidUpdate") // + shouldComponentUpdate
	return () => console.log("???")
}, [state])

// WRONG!!
useEffect(() => {
	console.log("CDM 쓰고 싶어요")
}, [])

useEffect(() => {
	console.log("CDU 쓰고 싶어요")
}, [state])