DEV Community

Pablo Yeverino
Pablo Yeverino

Posted on

1

Cleaner React validations

10/28 - Yesterday I finished an assignment related to a 'Change phone-number form and it looks like this:

Alt Text

So, to validate I need to check every change of the Input fields in order to enable or disable the button... easy right??

Just for context, I'm using useState hooks for each value of the field and another one to the enabling state of the button. Also, I'm managing state with MobX, so the user's current phone number and country code properties of userStore. Hopefully it's enough context for the next snippets.

Alt Text

After some really nice PR review, my code was simplified to this:

Alt Text

I really like the approach because is pretty much self explanatory and a little bit cleaner.

What am I doing today:

  • Start doing push ups each two brakes. That means that if I take a brake every hour, I should do 4 rounds of push-ups a day. What do you thing??
  • Take at least 30 minutes of video editing course.

If you got all the way over here, I really appreciate it!!

If you want to, follow me on Twitter

Heroku

This site is built on Heroku

Join the ranks of developers at Salesforce, Airbase, DEV, and more who deploy their mission critical applications on Heroku. Sign up today and launch your first app!

Get Started

Top comments (1)

Collapse
 
cuginoale profile image
Alessio Carnevale

I am proposing a simple and clean approach to form validation here:
dev.to/cuginoale/form-validationsu...

Please let me know what you think! :)

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay