What is an Autovalidating form?

They’re everywhere!

In this chapter, we’ll be building an auto validating form. You see this in a lot of places across the web, so you might hardly notice it anymore. However, poorly done forms can easily give users a negative impression of your product. When they’re already filling out a form, it means they’re engaged and giving some information. This is not an area of your app that you want them to form negative impressions.

Understanding validation complexity

Forms that do more than just give you some input fields and let you submit freeform data has a surprising amount of complexity. For example, you rarely get to think about what constitutes a valid email address until you implement one of these. Do you just want to accept any string of characters, followed by @ followed by another string with a dot? Or do you want completeness, which could be loosely achieved with a regex like the this?

Our target

At one point or another in your career as a frontend engineer, customized inputs will almost certainly be something you’ll have to think about. We’ll be building out Gmail’s signup form together, and I believe it’ll cover enough cases that you’ll be able to extend it to your ​forms. ​