Sign-up-form, React, TypeScript, Zod validation, react-hook-form, Vite

In this project I tried to test my skills with learning TypeScript and React. Learning the Zod validation library was very useful as it plays nicely with TypeScript -- I could create a type for the form schema so that it is typechecked with TS while I'm coding. export type UserSchema = z.infer<typeof User>; It also allowed me to create further checks for inputs and custom error messages, e.g. the password field requires 8 - 20 characters with at least one lower and one uppercase letter, and one number.

React-hook-form was also great to use as it helped with a lot of built in functions to set focus to inputs on errors etc. and it also has integration with Zod, so I could pass my Zod form schema to it to use handle the validation.

I also tried to implement semantic html and accessibility by using a visually hidden class for labels, and error messages with the role="alert" attribute.