[Korean FE Article] 꼭 써봐야 하는 10가지 리액트 커뮤니티의 훅(hook)들
글 링크: https://velog.io/@eunbinn/10-React-community-hooks-you-should-be-using
소개
리액트 커뮤니티에서 만들어진 10가지의 유용한 훅(hook)을 소개하고 있습니다. 리액트로 서비스를 제공하고 계신다면 분명 도움이 될 훅이 하나쯤은 있을 것이라고 생각합니다 :) 이 글에서 소개하고 있는 라이브러리를 통해 훅을 사용하거나, 라이브러리의 코드를 직접 확인해보시면서 custom 훅을 만들어보셔도 좋을 것 같습니다.
tl;dr
명확하고 간결한 코드 작성을 위해 리액트에서 유용하게 사용할 수 있는 10가지 커뮤니티 훅을 소개합니다.
react-hook-form: 간단한 코드 몇 줄 만으로 무거운 폼(form) 코드를 처리할 수 있습니다.
useUpdateEffect: 업데이트 시에만 동작하는 useEffect입니다
useCopyToClipborad: 클립보드 복사가 필요할 때 사용합니다
useLocalStorage: 브라우저 로컬 스토리지를 간단하게 사용합니다
useHover: 엘리먼트가 hover 됐는지 확인할 때 사용합니다
useIdle: 사용자가 유휴(idle) 상태인지 확인할 때 사용합니다
useClickAway: 특정 컴포넌트의 외부를 클릭할 경우 함수를 트리거합니다.
useDebounce: 특정 함수를 실행하기 까지 일정시간 기다립니다
useWindowSize: 스크린의 높이, 너비를 변화를 감지하여 업데이트합니다
useSwr: 컴포넌트가 마운트 될 때 발생하는 요청을 쉽게 처리할 수 있습니다