Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

Learn how to use TypeScript & Zod validation together in this tutorial. We will also apply TypeScript & Zod with React-Hook-Form to provide both user input validation and feedback. TS + Zod together provides both type safety and runtime type checking!

Become a full-stack web dev with Zero To Mastery Courses:
- The Complete Web Developer: https://bit.ly/WebDevMaster
- Master the Coding Interview: https://bit.ly/FAANGInterview
- Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr

Subscribe https://bit.ly/3nGHmNn

Course Updates https://courses.davegray.codes/

Questions - Please post them to my Discord https://discord.gg/neKghyefqh

Buy Me A Coffee https://www.buymeacoffee.com/davegray

Follow Me On Social Media:
GitHub: https://github.com/gitdagray
Twitter: https://twitter.com/yesdavidgray
LinkedIn: https://www.linkedin.com/in/davidagray/

Source Code: https://github.com/gitdagray/zod-typescript-react-hook-form

Typescript Playlist: http://bit.ly/3GcNJ78

Typescript & Zod tutorial with React-Hook-Form

(00:00) Intro
(00:05) Welcome
(00:28) What is Zod? And does Zod do?
(01:35) Starter Code & Dependencies
(02:30) Basic Zod Examples
(04:48) User API Data
(05:07) Basic User Schema with Zod
(10:05) Inferring Types, Fetching & Parsing Data
(12:47) Merging & Extending Zod Schemas
(18:34) React-Hook-Form dependencies
(19:21) React-Hook-Form docs
(20:54) zodResolver & React-Hook-Form

Tutorial References:
Zod Official Website: https://zod.dev/
React-Hook-Form Official Website: https://www.react-hook-form.com/
NPM @hookform/resolvers: https://www.npmjs.com/package/@hookform/resolvers
{JSON} Placeholder: https://jsonplaceholder.typicode.com/users

Web Dev Tools:
Vite: https://vitejs.dev/
Tailwind CSS setup for Vite: https://tailwindcss.com/docs/guides/vite
Chrome Browser: https://www.google.com/chrome/
Visual Studio Code (VS Code): https://code.visualstudio.com/

Was this Zod & TypeScript tutorial with React-Hook-Form helpful? If so, please share. Let me know your thoughts in the comments.

#typescript #zod #tutorial