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. ​