Introduction to AngularJS

1. AngularJS
Introduction to
FrontEnders Ticino

2. @aldopizzagalli
Aldo Pizzagalli
UX Designer

3. Why use AngularJS ??

4. Let’s go back to 3 months ago….

5. During a meeting…

6. Which Technology??

7. ok… we need to change our architecture…
but how??

8. Which Framework?? http://todomvc.com/

9. Google Trends
Follow the
Blue line…

10. Two Way Data Binding
Dependency Injection
MVC - MVVM
Ready for Web Component

11. I often say that AngularJS is
what the web browser would
have been, had it been designed
for application
Miško Hevery
AngularJS Creator

12. Talk is cheap. Show me the code!!

13. Directives
A directive is a behavior or DOM transformation
which is triggered by the presence of a custom attribute,
element name, or a class name.
A directive allows you to extend the HTML vocabulary in a
declarative fashion.
AngularJS's developer guide
(http://docs.angularjs.org/guide)

14. AngularJS Hello World

16. Controllers
A controller is a JavaScript constructor function that
is used to augment the Angular Scope.
AngularJS's developer guide
(http://docs.angularjs.org/guide)

17. Codice Controller

19. Modules
You can think of a module as a container for the different
parts of your app – controllers, services, filters,
directives, etc.

20. Bower
by Twitter
A package manager for the web
http://bower.io

22. Dependency Injection (DI) is a software design pattern that
deals with how code gets hold of its dependencies.
Dependency Injection

23. Services
Angular services are singletons that carry out
specific tasks.

24. Codice creazione di
un servizio

25. Configurations

26. Routing
AngularJS is perfect to build single page web applications.
So… what about routing??

27. Routing

28. Test
never forget…
twice a day, everyday!!
http://jasmine.github.io/

29. about.me/aldopizzagalliFrontEnders Ticino