Replies: 2 comments 1 reply
-
Yes, I am down for using react-hook-form. It will simplify the states & props of our form elements 👍 |
Beta Was this translation helpful? Give feedback.
1 reply
-
Zod is a very nice validation package. I was thinking it will be a good idea to use it on the backend too. |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Although I don't have experience using react-hook-form (have used formik) it seems like formik may no longer be maintained.
React hook forms has validation but use the browser which I think can be manipulated by an end user. I feel like we can do better with yup
I came across this article on dev.to, it explains how to set up yup and react hook form.
yup is very simple to use, here is an example of validating a new user form:
const validationSchema = yup.object().shape({ username: yup.string().required("Username is required"), password: yup.string().required("Password is required"), passwordConfirmation: yup.string() .oneOf([yup.ref('password'), null]) .required('Password confirmation is required') });
validating a number between 1 and 5:
const validationSchema = yup.object().shape({ number: yup.number() .typeError('number entry must be a number between 1 and 5') .min(1, "number must be between 1 and 5) .max(5, "number must be between 1 and 5) });
links:
Dev.to Article: https://dev.to/franciscomendes10866/react-form-validation-with-react-hook-form-and-yup-4a98
yup: https://github.com/jquense/yup
zod: https://zod.dev/
react-hook-form: https://react-hook-form.com/
Beta Was this translation helpful? Give feedback.
All reactions