Mohammed Anas
Mohammed Anas12mo ago

client side Validation with ZOD

will trpc validate input on the client before sending it to the server ?
8 Replies
Twan
Twan12mo ago
i don't think so, thats why its fully typed so you make sure you set the right properties when sending to the server.
Mohammed Anas
Mohammed AnasOP12mo ago
so the zod schema is only utilized on the server?
kristiandupont
kristiandupont12mo ago
Yes.
Mini
Mini12mo ago
you can share zod schema with client/server
Twan
Twan12mo ago
but doesn't this defeat the purpose of typescript and server validation. I would have ui restrictions but there is no reason to double validate while the server already validates.
Dexter
Dexter12mo ago
You can share Zod schema with the client and use it for your validations. We do that with react hook form It takes care of the validations out of the box (for a CSR app) However the server uses the schema to validate the payload as well, and rejects it if it’s invalid. Which can happen if you don’t use client side validation.
Mini
Mini12mo ago
there is some few cases, like want check validate and show error message when value is changed, it must required client side validation. (Mostly for ui/ux features)
Nick
Nick12mo ago
You can definitely achieve it using the API if you want (see errorFormatter docs) but yeah, put your zod types somewhere shared and use them on the frontend 🙂

Did you find this page helpful?