[React] custom hook도 함수라고

취업 전에 "custom hook을 언제 쓰는가?"라는 질문을 들었을 때, API를 연결하는 것처럼 반복적인 작업을 한 곳에 모아두기 위해 사용한다고 생각했다. 이것도 틀린 말은 아니지만 이 말을 반복하고 나니 API를 연동할 때 커스텀 훅을 만든다, 커스텀 훅은 API 연동할 때 만든다와 같은 잘못된 생각이 머릿속을 차지하게 되었다. 이렇게 했더니 반복된 코드를 훅으로 만들어야겠다는 생각은 드는데 훅이랑 함수랑 뭐가 다르지? 훅 안에서 useEffect를 쓸 수 있나? 그냥 부르는 건데 이게 됐던가? 뭐더라? 혼자 북치고 장구치고 다했다.

공식 문서를 다시 읽어보자.

커스텀 훅도 함수다. 정확히 말하자면, use로 시작하는 자바스크립트 함수이다. use를 왜 붙여야 할까? 이걸 붙여야 리액트가 이름만 보고도 Hook 규칙이 적용되는 함수라는 것을 알 수 있기 때문이다.

Hook 규칙

1. 반복문, 조건문 혹은 중첩된 함수 내에서 Hook을 호출하지 않는다.
   • for문 안에서 useState를 쓰거나, if문 안에서 useEffect 호출하는 거 ❌
2. 리액트 함수 내에서 Hook을 호출한다.
   • 함수 외부에서 useState 쓰면 리액트가 이해를 못 함.

내가 생각한 거에 대한 답

• 커스텀 훅도 함수다. hook 규칙을 적용해서 조금 특별할 뿐.
• 훅을 호출한다는 것은 함수를 실행하는 거니까 hook 안에서 useEffect 쓰면 걍 잘 돌아가는 것이다.

이름이 커스텀 훅이지 뭐 거 함수니까 잘 만들어 쓰자고.