DEV Community

Mahmoud Abdelwahab
Mahmoud Abdelwahab

Posted on

What's the best approach for form validation in React?

I had a task where I needed to validate a sign-up form in React.
There was a name, email, password, confirm password, and a checkbox. All fields were required and the password had a couple of rules.
I got it to work using Formik + Yup, was that overkill for this use-case?

I found that there are a ton of form validation libraries, which one should I work with? What makes one better than the other?

Discussion (7)

Collapse
farazamiruddin profile image
faraz ahmad

I personally always use formik. It's battle tested, and can support several different form types.

Even for simple forms I like formik because as the application grows I have already set up some patterns.

I think I have an idea for my next opinionated piece! πŸ˜…

Collapse
thisismahmoud profile image
Mahmoud Abdelwahab Author

Awesome! πŸ˜„

Collapse
emma profile image
Emma Goto πŸ™

I've never used it but I've seen some great things from react-hook-form! The owner of the repo is really on top of things and I think it has one of the smallest (if not the smallest?) bundle sizes for form validation libraries out there.

Collapse
thomaslombart profile image
Thomas Lombart

IMO, it is overkill. I think Formik + Yup is great when your app is heavily form based. If that’s your only use case, you’ll be fine with a custom solution πŸ™‚

Collapse
thisismahmoud profile image
Mahmoud Abdelwahab Author

Makes sense, thanks Thomas!

Collapse
dorshinar profile image
Dor Shinar

Formik and yup are a great pair. Although it does seem like you have a somewhat basic use case, and you can probably rely on basic HTML form validation.

Collapse
thisismahmoud profile image
Mahmoud Abdelwahab Author

I'll check out other solutions. Thanks Dor!