React Hook Form and Zod

There are many ways of handling forms with React, and one of the most common patterns was shown in Chapter 5, Setting Up a React Workflow. State variables are created with the useState Hook, the form is prevented from submitting and is intercepted, and, finally, the data is passed through JSON or as form data. While this workflow is acceptable when working with simple data and a couple of fields, it can quickly become difficult to manage in cases where you have to keep track of dozens of fields, their constraints, and their possible states.

RHF is a mature project with a thriving community and is distinguished from other similar libraries by its speed, minimal amount of rendering, and deep integration with the most popular data validation libraries for TypeScript and JavaScript, such as Zod and Yup. In this case, you will learn the basics of Zod.

Performing data validation with Zod

The JavaScript and TypeScript ecosystem currently has several validation...