Hooks

함수 구성 요소의 상ㅇ태를 추적할 수 있다.상태는 일반적으로 애플리케이션에서 추적해야 하는 데이터 또는 속성을 나타낸다.함수 구성 요소를 호출하여 상태를 초기화 한다.초기 상태를 받아들이고 두 개의 값을 반환한다.현재상태상태를 업데이트하는 함수첫 번째 값 color는

useEffect Hook을 사용하면 구성 요소에서 부작용을 수행할 수 있다.부작용의 몇 가지 예는 데이터 가져오기, DOM 직접 업데이트 및 타이머이다.useEffect는 두 개의 인수를 허용한다.useEffect(function, dependency)useEffec

useRef Hook을 사용하면 렌더 간에 값을 유지할 수 있다.업데이트할 때 다시 렌더링하지 않는 변경 가능한 값을 저장하는데 사용할 수 있다.DOM 요소에 직접 액세스하는 데 사용할 수 있다.Hook을 사용하여 애플리케이션이 몇 번 렌더링 되는지 계산하려고 하면 u

React Context는 상태를 전역으로 관리하는 방법이다.Hook과 함께 사용하면 단독으로 useState를 사용하는 것 보다 더 쉽게 중첩된 구성 요소(컴포넌트) 간에 상태를 공유 할 수 있다.상태는 상태에 대한 액세스가 필요한 스택에서 가장 높은 상위 구성 요소

const memoizedValue = useMemo(() => computeExpensiveValue(a, b), a, b);메모이제이션 된 값을 반환한다."생성(create)" 함수와 그것의 의존성 값의 배열을 전달한다. useMemo는 의존성이 변경되었을 때에만

메모이제이션된 콜백을 반환한다.인라인 콜백과 그것의 의존성 값의 배열을 전달한다. useCallback은 콜백의 메모이제이션된 버전을 반환한다. 그 메모이제이션된 버전은 콜백의 의존성이 변경될 때에만 변경이된다. 불필요한 렌더링을 방지하기 위해(shouldCompone

useReducer는 useState와 유사하다. 복잡한 논리에 의존하는 여러 상태를 추적하는 경우 useReducer를 사용 할 수 있다.useReducer(reducer, initialState);reducer 함수는 사용자 정의 상태 논리를 initialState

useQuery는 React Query를 이용해서 서버로부터 데이터를 조회해올 때 사용한다.💡 데이터 조회가 아닌 데이터 변경 작업은 useMutation을 사용한다.DB로 비유를 하자면 SELECT를 할 때 사용된다고도 할수있다.useQeury를 코드로 작성하여 구

useMutation은 React Query를 이용해 서버에 데이터 변경 잡업을 요청할 때 사용한다.데이터베이스로 비유하자면 insert, update, delete가 모두 포함된다.mutationFunction 은 Promise 처리가 이루어지는 함수이다.fetch