Form State

폼 상태는 값, 검증, 제출 책임을 나누면 커져도 무너지지 않는다

values, errors, touched, isSubmitting을 한 컴포넌트에 몰아넣기보다 변경 주체와 신뢰 경계에 따라 소유권을 나눈다.

화면 소유

표시 상태

열림, 접힘, 포커스 표시를 둔다.

입력 연결

필드 값과 이벤트를 화면에 묶는다.

폼 로직 소유

Reducer

change, blur, reset 전환을 모은다.

Custom Hook

values, errors, touched를 재사용한다.

신뢰 경계 소유

Schema

Zod, Yup 규칙을 UI 밖에 둔다.

Server

권한과 중복 검사는 서버가 판단한다.

01 필드 묶기

값과 오류 이름을 같은 기준으로 맞춘다.

02 전환 모으기

이벤트가 늘면 reducer로 경로를 만든다.

03 검증 분리

동기 규칙과 서버 규칙을 구분한다.

04 제출 잠금

isSubmitting으로 중복 제출을 막는다.