랜덤 레시피를 불어와 화면에 보여주는 컴포넌트 내부에 있던 react-query 코드를 분리하는 중에 에러가 발생했다. 원인은 Hook을 불러오는 과정에 있었다. 리액트에서 Hook을 사용할때 지켜야할 조건이있다. 1. 리액트 함수 내에서만 사용되어야한다. (일반적인 js 내에서는 호출 불가능) 2. 리액트 함수 최상 위에서 호출해야한다. (반복문, 조건문, 중첩 함수 내에서 호출 불가능 ) useState 나 useEffect 같은 Hook 들은 여러번 사용될 수 있는데, 이 Hook들은 호출되는 순서대로 저장해 놓는다.(LinkedList) ( 그래서 매 렌더링마다 순서대로 Hook을 호출할 수 있는것 ) 항상 리액트 함수 최상위 레벨에서만 Hook을 호출해야하는 이유 근데 조건문이나 반목문 안에서 ..
