Building an efficient, scalable and maintainable form rendering and validation system with Ember

1. Form building made easy with
Ember

3. Forms are a problem

4. Lets see how
Design a registration form for GirlsWhoJS
• Applicants must enter name, email and gender
• Only letters with spaces are allowed in the name
field. Name should be between 5 and 20
characters.
• Email should be of format abc@example.com.
• All are mandatory fields.
• Submit button should be enabled only when all
fields are entered and in valid formats.

5. One way to do this
(code for a traditional approach)

6. The Problem
• Form rendering and validations is repetitive
logic
• Code is duplicated
• Leading to increased maintenance costs

7. Ember to the Rescue
• Observer pattern
• Component logic
• Inheritance

8. The Ember Way
(Artoo’s solution for form building)

9. Thanks!
Aparna Vaikuntam
Architect at Artoo