Adding form validation to your React app? Try the "reward early, punish late" pattern 🏆

You can codegen this for any app using simple-form!

Got a full code walkthrough using Astro and Next.js!

I love these types of subtle UX improvement tips.

These features already available in react-final-form. it's an underdog for form state management as well as light weight package

Really top quality video. Have you thought of using Zod with your form validations?

@LinkedKev Not just *thought* about it. I made a wrapper library 😄

This has brought me psychic peace, always felt like early early was wrong but not sure why

Great video, Ben!!!

Yep, this is why most form packages have isTouched (onBlur) or isDirty (after user modifies field) to allow you to implement things like this.

what about checking on input but only after user stops typing? solves both cases I think

Sounds like validating on a debounce. That's nice sometimes as well! Still, it assumes the user is able to type at a certain speed, and it's hard to dial in an accessible value. Waiting for blur makes certain you validate once the user is done