This document discusses switching to the Angular.js framework. It provides an overview of Angular.js, including its history and contributors. It also addresses common concerns developers have in switching like learning curves and differences from jQuery. The document outlines when not to switch, such as for simple applications or those requiring high performance. It provides recommendations for Angular.js implementation including dependency injection and using directives over jQuery for DOM manipulation.

1. Switching to Angular.js
Silk way

2. About me
● Working as Front-end Lead Developer in GlobalLogic
● Used to develop Mobile Web Applications and HTML5
Games.
● Long time ago done Flex and ActionScript
● Contacts:
○ Skype: pavlo.yuriychuck
○ @pavlo_yuriychuk
○ Google+

3. Angular.js - PM point of view
● First release @ Oct 20, 2010, 0.9.0
● Contributors:
○ Miško Hevery - original author
●
●
●
●
○ Igor Minar
○ Vojta Jina
○ Matias Niemelä - Year of Moo blog
○ Pete Bacon Darwin
Reputation of vendor Google Closure && GWT
Docs: O’Reilly book, Packt publishing, Scripty book
Support: Google groups && Github issues
Ecosystem

4. Angular.js according to worried devs
●
●
●
●
●
Comments in official docs ;)
No more require.js ?
Learning curve with expanding amplitude
Where is my jQuery why jqLite ?
Global functions and callbacks in html ?

5. This presentation is not about
worrying ;)

6. Hierarchy of front-end problems solved by
frameworks and libraries
1. Cross browser - jQuery, Underscore, Twitter bootstrap
2. Applications
a. MV* - Backbone, Exos.JS, Knockout, Ember, Ext.JS,
Chaplin, Marionette, Can.JS, Thorax
b. Realtime - Meteor, Derby
c. Functional - Bacon.JS
3. Modularity and packaging - Require.JS || LMD, Bower,
Component.JS
4. Infrastructure - Angular.JS, Closure, DojoToolkit

7. Automation stack
●
●
●
●
●
●
●
●
Node version manager and Node.js
Grunt.js
Bower || Component
Docular || JSDoc
Karma.js drives Jasmine || Mocha + Chai + Sinon.js
LESS || SASS
Yeoman
Istanbul for code coverage

9. Implementation of domain aspects
● Switch from Inheritance to Dependency
Injection
● Decoupling of Model and Collection from
connection to the server side
● Directive as the only place to work with DOM
● No dedicated router class

11. Continuation
● Factories to store shared data
● Services to handle business logic
● Providers to store configurable shared data, i.e. i18n,
i10n, routes
● Directives to modify DOM and for small components
● Views for widgets
● Controllers to connect view and services
● Decorators to modify the behavior of existing services

12. Dos and Donts
● if ($scope.$$phase) $apply() / $digest()
everywhere - No
● DOM manipulation in controller - No
● $.Deferred and $.ajax instead of $http,
$resource, $q
● Minsafe [`$http`, function ($http) {}] - Yes

13. Dos and Donts
● Do not try to put custom method into $rootScope
● If you have data that is shared between elements that
are using ng-repeat and filters - split it over separate
arrays
● Whenever you see $scope.filterByXXX, $scope.
mapXXXtoYYY, $scope.getXXXbyYY it is high time to
use filters
● Do not put heavyweight operations into $watch and
$scope event heandlers

14. Switching to Angular.js
When not to switch:
1. Perhaps you need something simpler,
different paradigm, see the slide #6
2. Game development
3. High-performance data visualization and
rendering (VNC console, real-time video)
4. Lightweightness is critical

15. Readings
●
●
●
●
●
Before you start
Learning course
Recipies with Angular by Frederik Dietz
Comparison to other frameworks
The future of Angular.js by Brian Ford

16. A little bit of Angular ;)
// Insanity Warning: scope depth-first traversal
// yes, this code is a bit crazy, but it works and we have tests to prove it!