Installation and Setup

Let's get React Hook Form installed and make sure everything is wired up before we build anything real.

Installing React Hook Form

Run this in your project root:

npm install react-hook-form

Using pnpm or yarn? Same idea:

pnpm add react-hook-form
# or
yarn add react-hook-form

That's the only required dependency to get started. React Hook Form has zero external dependencies — it's lightweight by design.

TypeScript Configuration

React Hook Form is written in TypeScript and ships its own type definitions. It works best with strict mode enabled. Make sure your tsconfig.json includes at least these settings:

{
  "compilerOptions": {
    "strict": true,
    "moduleResolution": "bundler",
    "jsx": "react-jsx"
  }
}

Strict mode gives you the best type inference on form values, error objects, and field registration — you won't need to annotate most things manually.

Installing Zod (for later)

In the validation section of this course we'll use Zod with React Hook Form's official resolver. Go ahead and install both now so they're ready when we need them:

npm install zod @hookform/resolvers

Or with pnpm/yarn:

pnpm add zod @hookform/resolvers
# or
yarn add zod @hookform/resolvers

You won't need these right away, but it's nice to have them in place.

Project Structure

Any standard React + TypeScript setup works fine. If you're starting fresh, Vite is the quickest way to get going:

npm create vite@latest my-app -- --template react-ts
cd my-app
npm install
npm install react-hook-form zod @hookform/resolvers

Vite gives you fast builds, hot module replacement, and a clean project structure out of the box.

Verifying the Install

Let's make sure everything is working. Drop this into src/App.tsx:

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

function App() {
  const { register } = useForm({
    defaultValues: {},
  });

  return <div>React Hook Form is ready!</div>;
}

export default App;

Run the dev server:

npm run dev

If you see "React Hook Form is ready!" without any TypeScript errors or import complaints, you're good to go.

That's all the setup you need. From here, you have a clean project ready to build your first form.