From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Zod demo usage

Zod demo usage

Hello and welcome back. In this video, we are going to see how we can integrate the Zord library with the React hook form library. As you know, the Zord library is preferred when you are using TypeScript. So if you are going to have a TypeScript project, like we are doing, you should be preferring the Zord library. The steps are the same as per the YARP library. You have to install Zord. You can do that by npm install, Zord and hook form resolvers. The next step is to define a Zord-based schema. You can import Zord object from the Zord library. As you can see, this is more TypeScript friendly, so you can directly import a Z object. Then you have to define the schema, which will be done by calling the z.object. And inside this, you can provide your form field names and your data types, minimum, maximum values, required, not required, etc. When you want to use it, it's also pretty same like the Yelp library. You have to import the ZordResolver from HookFormResolver's Zord at the top…

Contents