The document outlines an agenda for building an AngularJS application. The agenda includes explaining what AngularJS is and why it should be used, demonstrating how to build an AngularJS app through 23 code commits, and providing links to the source code, specifications, and running application. The speaker is the principal architect Jeremy Likness and aims to answer questions about AngularJS.
3. www.ivision.com
• Business Process
Management/ALM
• Custom Application
Development
• Collaboration
• Business Intelligence
4. TODAY’S AGENDA
1. What and Why? What is Angular? Why use it?
2. How? How do you build an AngularJS app?
3. Q&A Guaranteed answers.
Source Code: https://github.com/JeremyLikness/AngularHealthApp/
Specifications: http://jeremylikness.github.io/AngularHealthApp/test.html
Running App: http://jeremylikness.github.io/AngularHealthApp/
6. WHAT AND WHY?
I’m biased because …
25
developers
80,000+
L.O.Ts.C
200+
components
3
years
4x
Improvement
Global
Parallel Team
7. WHY?
4x
Improvement
• Began effort (6 mos.) with JavaScript and KnockoutJS
• Changed to use AngularJS and TypeScript
• 4x faster development, attributed in a large part to Angular
33. Questions?
Source Code: https://github.com/JeremyLikness/AngularHealthApp/
Specifications: http://jeremylikness.github.io/AngularHealthApp/test.html
Running App: http://jeremylikness.github.io/AngularHealthApp/
This Deck: http://www.slideshare.net/jeremylikness
Jeremy Likness, Principal Architect @JeremyLikness
Hinweis der Redaktion
The height functionality required an additional height filter specification. The height filter is a bit different for
two reasons. First, it depends on other services so it is the first example of a filter with a dependency. Second, it
should not attempt to convert the input value if it is a min/max range value because this is hard-coded on the
controller. Therefore, it takes a parameter to avoid the conversion step for those ranges. The controller was updated
to expose the height and range values and the UI updated with a slider. Notice that you can now change the height as
well as toggle the unit of measure and see it all reflected dynamically. There is no special messaging or watch because
the properties depend on each other and Angular will automatically reevaluate the values when the model is mutated.
A quick pass at styling makes for consistent UI elements and allows them to flow to fill the space. The app is now
responsive to wide and small (mobile) configurations.
Weight specifications have been added. The weight input will be free form, so additional validation must exist to
ensure the user profile is never populated with an invalid weight. The specifications detail these requirements along
with the necessary filter to show the proper unit of measure. These are failing because the weight functionality has
not yet been implemented.
The weight form and styles are added and the conversion is now testable using the input field. For weights within the
range the conversion works seamlessly when the unit of measure is changed. The user profile was updated to capture the
most recent unit of measure. This way when the unit of measure changes, it can convert the weight values for exposure
to the UI. This should only happen at the precise moment of conversion; not before or after.
The age specifications are added and age input implemented in the UI. Now the user profile is complete and we can focus
on exposing the formulas.