React Hook Form

Performant, flexible forms with easy-to-use validation

form

Reduces re-renders and boilerplate. Works with any UI library.

ReactFormsValidationPerformance

🎮 Playground

import { useForm } from "react-hook-form"

export default function Demo() {
  const { register, handleSubmit } = useForm()
  
  return (
    <form onSubmit={handleSubmit(data => console.log(data))}>
      <input {...register("email")} placeholder="Email" />
      <button type="submit">Submit</button>
    </form>
  )
}

Open Sandbox

Use cases

•Login forms
•Multi-step forms
•Dynamic forms

Good for

✓Complex form logic
✓Performance optimization
✓TypeScript projects

Not good for

✗Very simple single-field forms
✗Non-React projects

Installation

$ npm install react-hook-form

Example

import { useForm } from "react-hook-form"

export default function Demo() {
  const { register, handleSubmit } = useForm()
  
  return (
    <form onSubmit={handleSubmit(data => console.log(data))}>
      <input {...register("email")} placeholder="Email" />
      <button type="submit">Submit</button>
    </form>
  )
}

Comparison

"Faster than Formik with less boilerplate, more flexible than React Final Form."

Trust Metrics

42K

GitHub Stars

6.5M

Weekly Downloads

Last Commit:last year

Used by

MicrosoftAmazonTwitch

View on GitHub View on npm