useCallback 또한 메모이제이션 기법으로 컴포넌트 성능을 최적화 시켜주는 도구이다. 앞서 알아본 useMemo을 복습하면 useMemo는 자주 쓰이는 값을 메모이제이션 즉 캐싱해준다. 그리고 그 값이 필요할때 다시 게산을 하는 것이 아닌 useMemo를 통

컴포넌트 최적화를 위해 사용되는 대표적인 hook은 useMemo와 useCallback이 있다. 먼저 useMemo 대해서 파헤쳐보자.useMemo에서 Memo라는 말은 Memoization을 뜻한다.동일한 값을 리턴하는 함수를 반복적으로 호출할 경우 맨 처음 값을

리액트의 일반적인 데이터 흐름은 부모 컴포넌트에서 자식 컴포넌트로 props를 통해 '단방향'으로 흐른다. 엄청 큰 컴포넌트 트리가 있다고 가정할 때 공통적으로 필요한 전역적인 데이터가 있을 수 있다. 예를 들어 userdata전역 데이터를 일일이 props로 단계별로

함수형 컴포넌트에서 useRef를 부르면 ref 오브젝트를 반환해준다.인자로 넣어준 초기값 value는 ref 안에 있는 current 에 저장이 된다. ref 오브젝트는 수정이 가능하기 때문에 언제든 원하는 값으로 바꿔줄 수 있다. 반환된 ref 는 컴포넌트의 전생애

리액트 hooks 중에서 가장 중요한 useEffect를 파헤쳐보자!! 화면에 척 렌더링되는 것을 Mount 다시 렌더링이 되는 것을 Update 화면에서 사라진 것을 Unmout > 특정 작업을 처리할 코드를 실행시켜주고 싶을 때 사용하는 것이 useEffect

리액트에서 함수현 컴포넌트를 사용하면 리액트의 편리한 hook을 사용할 수 있다. hook의 종류는 다양한데 그 중 가장 기본적이고 제일 중요한 useState를 다시 공부해보자. useState 란? 컴포넌트의 상태를 간편하게 생성하고 업데이트 해주는 도구를 제공