React Hook Form

리액트에서 폼 데이터를 다루기 위한 라이브러리

Less code, More performant : 불필요한 리렌더링을 제거하면서, 작성할 코드의 양을 줄어준다

🍥 제어 컴포넌트 vs 비제어 컴포넌트

제어 컴포넌트

리액트를 통해 제어하게 되는 컴포넌트, 리액트에 의해 값이 제어되는 컴포넌트

• <input>, <textarea>, <select>와 같은 폼 엘리먼트는 일반적으로 사용자의 입력을 기반으로 자신의 state를 관리하고 업데이트
• 리액트에서는 변경할 수 있는 state가 일반적으로 컴포넌트의 state 속성에 유지되며 setState()에 의해 업데이트
• state를 “신뢰 가능한 단일 출처 (single source of truth)“로 만들어 두 요소를 결합 → 그러면 폼을 렌더링하는 리액트 컴포넌트는 폼에 발생하는 사용자 입력값을 제어

⇒ 이러한 방식으로 리액트에 의해 값이 제어되는 입력 폼 엘리먼트를 제어 컴포넌트 (controlled component)라고 함