AngularJS roadmap.
-
Upload
dmytro-korol -
Category
Engineering
-
view
2.609 -
download
1
Transcript of AngularJS roadmap.
Angularroadmap
Challengeshttps://twitter.com/wesbos/status/694530601286676480
https://twitter.com/wesbos/status/699967550621380608
http://todomvc.com/
© whichcatisyourjavascriptframework.com
© whichcatisyourjavascriptframework.com
© whichcatisyourjavascriptframework.com
© whichcatisyourjavascriptframework.com
© whichcatisyourjavascriptframework.com
React vsAngular
React +Angular
invisionapp.com
upwork.com
timelyapp.com
privat24.ua
Angular 1.5
+ • dependency Injection
• separate structure (modules, view-controller-service)
• services
• custom directives and build-in
• testing e2e…
• open source community
• huge knowledge base
• easy start
Dependency Injectionhttps://docs.angularjs.org/guide/di
Viewhttps://docs.angularjs.org/guide/templates
Controllerhttps://docs.angularjs.org/guide/controller
Servicehttps://docs.angularjs.org/guide/services
Directivehttps://docs.angularjs.org/guide/directive
Component (Angular 1.5)https://docs.angularjs.org/guide/component
Documentationhttps://docs.angularjs.org/api
Out of the box• $q (promises) • $http +interceptors
• $filter• form validation
• animation• ng-repeat
Find out before starting
• $digest how it work in Angular 1.5. When it is executed? http://www.bennadel.com/blog/2595-using-scope-digest-as-a-performance-optimization-in-angularjs.htm
• how often executes and difference between $watch, $watchCollection, $watch(.., true) http://www.bennadel.com/blog/2566-scope-watch-vs-watchcollection-in-angularjs.htm
• $broadcast, $on http://www.bennadel.com/blog/2725-how-scope-broadcast-interacts-with-isolate-scopes-in-angularjs.htm
• sharing data between controllers (through services) https://egghead.io/lessons/angularjs-sharing-data-between-controllers
• how often filters are executed in ng-repeat (try $filter in controller) http://www.bennadel.com/blog/2489-how-often-do-filters-execute-in-angularjs.htm
• difference between ng-show and ng-if, setTimeout() and $timeout http://www.bennadel.com/blog/2548-don-t-forget-to-cancel-timeout-timers-in-your-destroy-events-in-angularjs.htm
Tips• controllerAs syntax
• use ng-repeat instead of ui-grid
• angular-moment for dates
• resolve in ui-router (freeze app, difficult debug)
• add loading (when send request) test on slow internet
• avoid nested ng-repeat
• avoid too many $watch
Open source community• Bootstrap
https://angular-ui.github.io/bootstrap/
• Angular-UI https://angular-ui.github.io/
• UI-router https://github.com/angular-ui/ui-router
• Angular material https://material.angularjs.org/
• Formly http://angular-formly.com/
• RestAngular https://github.com/mgonto/restangular
AngularUIangular-ui.github.io
UI Bootstraphttps://angular-ui.github.io/bootstrap/
UI Routerhttps://github.com/angular-ui/ui-router
Bootstrap 3. Gridif ie10+
Angular materialhttps://material.angularjs.org
CSS Flexbox
• Formly http://angular-formly.com/
• RestAngular https://github.com/mgonto/restangular
Grunt > Gulp > Webpack
Yeomenhttp://yeoman.io/
Links• https://egghead.io• https://bennadel.com
• https://github.com/johnpapa/angular-styleguide• https://toddmotto.com/
• http://thoughtram.io/• https://gitter.im/dev-ua/angularjs
Conclusion
• Now: many projects on AngularJS 1.X + ES5 TypeScript, ES6, CoffeeScript.
• Feature: Angular2, TypeScript, move to clouds (RestAPI).
Questions&
Answer
[email protected]://twitter.com/kodiua