custom hooks

song·2024년 10월 14일
0

커스텀 훅은 리액트의 훅 기능을 사용하여 재사용 가능한 로직을 분리할 수 있는 방법이다.
리액트에서 상태나 부수 효과 같은 기능을 여러 컴포넌트에서 반복해서 사용해야 할 때 동일한 로직을 반복하지 않기 위해 커스텀 훅을 사용한다. 커스텀 훅은 리액트 훅들을 조합해서 새로운 훅을 만들 수 있다.

Custom Hook의 특징
재사용성: 커스텀 훅은 특정 로직을 한 번 정의한 후 여러 컴포넌트에서 재사용할 수 있습니다. 예를 들어, 데이터를 불러오거나 폼 데이터를 관리하는 로직을 분리해 커스텀 훅으로 만들면 다른 컴포넌트에서도 쉽게 사용할 수 있습니다.

use 접두사: 기본적으로 use라는 접두사를 사용해 훅을 정의해야 React에서 이를 훅으로 인식합니다. 이는 React의 훅 규칙 중 하나로, 함수 이름이 use로 시작해야만 React가 그 내부에서 훅을 사용할 수 있도록 허용합니다.

상태 관리와 사이드 이펙트: 커스텀 훅은 내부적으로 useState, useEffect, useMemo 등과 같은 기본 훅을 사용할 수 있으며, 복잡한 상태 관리와 API 호출 같은 부수적인 효과를 손쉽게 처리할 수 있습니다.

로직 분리: UI와 비즈니스 로직을 분리해, 컴포넌트는 UI에만 집중하고, 로직은 커스텀 훅으로 따로 관리할 수 있습니다.

profile
굿

0개의 댓글