깔끔한 폼 개발과 정시퇴근을 위하여 react-hook-form

구조와 흐름

• React Hook의 함수형 컴포넌트 최상위 호출 규칙과 클래스 컴포넌트 상태 관리의 혼동 완화
• React SPA의 회원가입·촬영 예약 화면에서 입력값 검증과 동적 폼 관리 요구

선택 이유

• 입력값·에러 메시지·이벤트 핸들러·검증 함수의 반복 선언 감소
• register 이름과 제출 값 속성명의 연결로 API 요청용 값 매핑 단순화
• 비제어 컴포넌트와 ref 기반 등록을 통한 입력 중 리렌더링 감소

구조와 흐름

• register 옵션의 required, pattern, validate와 formState.errors 기반 검증 메시지 구독
• handleSubmit으로 기본 제출 동작 처리와 폼 값 콜백 전달
• useFieldArray의 fields, append, remove로 촬영 색상 입력 폼 동적 추가·삭제

적용해볼 점

• 다수의 입력 필드와 검증 규칙을 가진 회원가입 폼에 react-hook-form 적용
• 배열형 입력값과 중첩된 동적 폼 그룹 관리에 useFieldArray 활용