폼 상태 관리: useFormStatus 훅
폼이 제출되는 동안 사용자에게 피드백을 제공하는 것은 사용자 경험의 핵심입니다.
폼 상태 및 결과 처리: useFormState 훅
단순히 폼 제출 상태뿐 아니라, 폼 제출 후 서버 액션의 결과(예: 성공/실패 메시지, 유효성 검사 에러)를 클라이언트 컴포넌트에서 받아 UI에 반영해야 할 때가 있습니다.
웹 애플리케이션에서 폼(Form)은 사용자 입력을 받아 서버로 전송하고 서버 상태 변경을 시작하는 입력 경계입니다. 사용자 등록, 게시물 작성, 설정 변경처럼 실패와 검증 메시지가 필요한 흐름은 제출 대기 상태와 서버 응답을 화면에 분리해 보여줘야 합니다.
폼 입력, 제출 대기, 서버 액션 결과를 나눠 사용자가 보는 응답 흐름을 확인합니다.
Next.js App Router의 가장 큰 혁신 중 하나는 HTML 요소의 표준 action 속성에 서버 액션을 직접 할당할 수 있게 되었다는 점입니다.
폼이 제출되는 동안 사용자에게 피드백을 제공하는 것은 사용자 경험의 핵심입니다.
단순히 폼 제출 상태뿐 아니라, 폼 제출 후 서버 액션의 결과(예: 성공/실패 메시지, 유효성 검사 에러)를 클라이언트 컴포넌트에서 받아 UI에 반영해야 할 때가 있습니다.