React 19 RC와 useFormStatus 도입 고민

배경

React 19 RC가 11월에 공개되면서 폼 처리와 관련된 새로운 기능들이 추가되었다. 특히 useFormStatus와 useActionState 같은 훅들이 눈에 띄었다. 현재 프로젝트에서 React Hook Form을 사용 중인데, 새로운 API가 실제로 유용할지 검토해봤다.

useFormStatus 살펴보기

기존에는 폼 제출 상태를 관리하기 위해 별도 state를 만들어야 했다.

function SubmitButton() {
  const { pending } = useFormStatus();
  
  return (
    <button type="submit" disabled={pending}>
      {pending ? '저장 중...' : '저장'}
    </button>
  );
}

폼 컴포넌트 내부의 자식 컴포넌트에서 pending 상태에 접근할 수 있다는 점이 편리했다. Props drilling 없이 폼 상태를 참조할 수 있다.

현재 프로젝트 적용 고민

하지만 당장 마이그레이션하기엔 이른 감이 있다.

• React 19가 아직 RC 단계
• 프로젝트는 Next.js 14 기반이며 안정성 우선
• React Hook Form으로 구축된 복잡한 폼 로직 다수

대신 작은 사이드 프로젝트에서 먼저 시도해보기로 했다. Server Actions와 함께 사용하면 폼 처리가 꽤 간결해질 것 같다는 느낌을 받았다.

결론

새로운 폼 관련 훅들은 흥미롭지만 당장 프로덕션에 적용하긴 이르다. 2025년 상반기쯤 React 19가 정식 릴리즈되면 본격적으로 검토할 예정이다. 지금은 문서를 읽고 개념을 익혀두는 선에서 마무리했다.