DEV Community

React form validation with React Hook Form and Yup

Francisco Mendes on June 30, 2021

Validating user input on forms prior to submission, in my opinion, is one of the most important and fundamental things about a website these days. ...

Read full post

Ivars Kubliņš • Nov 10 '22

Hi! Where did you got that look of form? Some css, which didn't show or it is some inbuilt in hook Forms? How I can use my look then?

Francisco Mendes • Nov 10 '22

I used water.css

〽️ 𝙍𝙤𝙨𝙝𝙖𝙣 • Dec 26 '22

what is that

Soni Canra Wiguna • Aug 5 '23

it work, thank you so much

Tran Thu Thao • Aug 30 '22

so usefull thank u very much!!!

Anesu Napsta • Jun 23 '22

very usefull, i love yup and this comination with useForms is amazing. Thank you. Do you have another one for Redux/Toolkit

Soraya • Apr 12 '22

Amazing! Thank you for sharing.

Meet Makwana • Aug 11 '23

hii, i am using react-hook-form with Typescript

    const schema = yup.object().shape({
        email: yup.string().email().required(),
        password: yup.string().min(8).max(32).required(),
    });

    const { register, handleSubmit, formState } = useForm<IAuthLogin>({
        defaultValues: {
            email: '', // Set initial value for email field
            password: '', // Set initial value for password field
        },
        resolver: yupResolver(schema),
    });

the problem is with typescript it is asking me to add Type for resolver