less than 1 minute read

Day 37

사용자 정의 Hook 연습하기 (4) : useClickAway


  • 특정영역 외 부분을 클릭하면 이벤트를 발생시키는 훅이다.
  • 모달이나 팝오버 외부 부분을 클릭했을 때 사용된다.

사용자 정의 Hook 연습하기 (5) : useResize


  • 타겟 엘리먼트의 크기가 변했을 때 이벤트를 실행시키는 훅입니다.
  • 이미지가 background 엘리먼트의 resized된 크기에 따라 변하게 할 수 있다.

사용자 정의 Hook 연습하기 (6) : useLocalStorage, useSessionStorage


  • 로컬 스토리지와 세션 스토리지를 이용하기 위한 훅이다.

사용자 정의 Hook 연습하기 (7) : useForm


  • Form을 관리하는 훅이다.
  • Formik이라는 library를 이용하여 form을 관리하는 것이 좋긴하다.

사용자 정의 Hook 연습하기 (8) : useTimeout


  • 웹사이트에서 무언가를 처리한 뒤 n초 뒤에 적용되는 것을 위한 훅이다.
  • 함수 호출을 통한 방법과 컴포넌트가 로딩된 후 바로 실행되는 방법으로 만들어 본다.

사용자 정의 Hook 연습하기 (9) : useInterval


  • 웹사이트에서 반복적인 로직을 처리할 때 사용되는 훅이다.

사용자 정의 Hook 연습하기 (10) : useDebounce


  • 특정 기간내에 같은 이벤트가 호출됐을 경우 가장 마지막 이벤트만 호출되도록 만드는 훅이다.

Categories:

Updated: