Validate Data With Zod in Server Actions Next.js (Client-Side + Server-Side)

👉 NEW React & Next.js Course: bytegrad.com/courses/professi...
Hi, I'm Wesley. I'm a brand ambassador for Kinde (paid sponsorship).
👉 Add authentication to your app FAST: bit.ly/3QOe1Bh
👉 NEW React & Next.js Course: bytegrad.com/courses/professi...
👉 Professional JavaScript Course: bytegrad.com/courses/professi...
👉 Professional CSS Course: bytegrad.com/courses/professi...
👉 Discord: all my courses have a private Discord where I actively participate
🔔 Email newsletter (BIG update soon): email.bytegrad.com
⏱️ Timestamps:
0:00 Solution
#webdevelopment #programming #coding

[@snivels]

Exceptionally well explained. Great video!

[@hamzamellahi120]

love your videos, please make more!

[@codiwebcat]

Fantastic video and all your content!

[@meka4996]

This is so amazing!!! This is much easier than React Hook Form + Zod! Thanks

[@mukulsinghbisht2434]

React hook form has its own advantages

[@aymenbachiri-yh2hd]

very clean explanation, thank you somuch

[@psyferinc.3573]

thanks
looking for a zod tutorial now

[@ajlmusic]

Excellent!

[@BuryneJoel]

Thank you sir

[@MuhamadAzizPrasetyo]

Thank you ☺☺

[@wingy3181]

Question: do you think the revalidation of the mutated data should be decoupled from the server action? that is, i notice that revalidatePath("/todos") is inside the server action....which means it couples the path to the server action....

[@writterpanditsid5048]

Thanks

[@lrnngman2942]

Can I use React hook form with Zod?
or should using only 1way?

[@jeromealtariba7339]

Hi, this is a nice video, however, when using actions (on not the onSubmit prop of the form), the client side validation is not triggerring at all. Only the server side validation is displayed.

[@GabrielLogan17]

Try my library too, multiform-validator

[@eSeMGie]

Great wideo! That's exactly what I was looking for. I have a question though. Why do we need validation on the client and server side? It seems to be redundant. Is any possible way to pass validation one the client side and fail validation one the server side? We actually passed already validated data to the server.

[@WebDevNiko]

client side validation is used to give normal user feedback if validation fails but you want also server side validation before pushing the data to database etc since client side isnt to be trusted as its easyer to modify and pass the validation if you would want to do that

[@eSeMGie]

@@WebDevNiko Big thanks for clarification!

[@eSeMGie]

@@WebDevNiko I wonder, why we can't just make a validation on the server side, and then if validation failed return all error messages to client and give the user feedback?

[@WebDevNiko]

@@eSeMGie you could do that but having extra validation on client side prevents sending unnecessary requests to server side, eg every time user forget to type last name you wont send request to server. Basically its just more efficent to have validation both on client and server side especially with zod since u can reuse the schema easyly so its effortless

[@janyumi1995]

cool

[@swdotdev]

Well the only problem with zod is that it makes large scale apps significantly slower. Other than that, yea it is great for sure.

[@user-xq2pi3bu4y]

you got great videos, but it is so hard to follow you as you speak too fast. thx

[@celsopires1999]

you can reduce the video speed if it too fast for you

[@sskular]

I actually love how snappy it is, to the point
You can reduce speed and I sometimes rewind and/or pause when I feel I need a better look at a particular part of the video