리액트 에서의 Form 관리

개발중인 프로젝트에서 Input 등을 활용하는 폼 양식을 사용하지 않는 프로젝트는 거의 없겠죠? 더군다나 프로젝트가 리액트 라면 리액트는 단방향 데이터 바인딩 방식 이기 때문에 폼 관리를 위해서는 일일이 이벤트를 지정해주어야 하는데요. 이러한 번거로움을 해결해주는 라이브러리가 React-Hook-Form 입니다. register 메서드를 이용하면 라이브러리 에서 폼관리에 필요한 상태를 관리해줍니다. 일일이 이벤트 함수를 만들지 않아도 됩니다. 폼양식 에서 필수인 Validation 처리도 required, erros 메서드 등을 통하여 비교적 손쉽게 처리가 가능합니다. 상태를 ReactHookForm 에서 별도로 관리하기 때문에, 여러 자식컴포넌트에 상태를 넘겨야 하는 복잡한 구조의 컴포넌트라면 굳이 자식컴포넌트에 Props 로 전달해주지 않아도 됩니다. 상태를 사용하는 해당 컴포넌트에서 ReactHookForm 의 상태를 불러와서 사용할수 있으니까요 리렌더링 횟수도 자동으로 최소화 해주어서 성능에도 좋다고 합니다. 혹시나 리액트 프로젝트의 폼양식을 직접 구현하고 계시다면 한번 도입해보시기를 추천드립니다.