Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.
Boyan Mihaylov
@bmihaylov
linkedin.com/id/bmihaylov
AngularJS 2.0
/ M.Sc. in Computer Science @ The University of Copenhagen
/ 7+ years professional experience
/ 3 years in Ebita
/ Confere...
Agenda
/ The status quo
/ Governing principles
/ The changing Web
/ AngularJS 2.0
/ ECMAScript 6
/ Changes
The status quo
/ Current stable version is 1.3
/ 1100+ contributors to the project on GitHub
/ Companies like Google, Amaz...
Governing principles
D.R.Y. Structure Testability
The changing Web
Mobile, mobile, mobile WebComponents.org
ECMAScript 6 Evergreen browsers
AngularJS 2.0
AngularJS 1.X is built for current browsers while
AngularJS 2.0 is being built for the browsers of the futur...
AngularJS 2.0
/ In process of research and define the version
/ Design documents are public and everyone can contribute
/ ...
ECMAScript 6
/ Still in draft
/ JavaScript.next-to-JavaScript-of-today compiler: Traceur
https://github.com/google/traceur...
Changes: change detection
/ Ultimate goal: Object.observe()
/ Asynchronously observing changes to
JavaScript objects witho...
Changes: dependency injection
/ No more a global module repository
/ Calls to angular.module() will always return a new mo...
Changes: templating (1)
/ Simpler definition of directives
/ Integration with other component frameworks via WebComponents...
Changes: templating (2)
Binding to
properties instead
of attributes
Event handlers
Interpolations
Changes: templating (3)
/ Another proposition for syntax
/ [attribute] – one way binding
/ [attribute|name] – same as abov...
Changes: persistence (1)
As a gamer, I want to play board games with my friends in multiplayer over the web. As I play the...
Changes: persistence (2)
/ Right now we have only $http and $resource
/ Mobile apps need to work in an “always offline” mo...
DEMO
https://github.com/omeganet/Employee-Register-POC
References
/ AngularJS 2.0
http://angularjs.blogspot.dk/2014/03/angular-20.html
/ AngularJS 2.0 Status and Preview
http://...
Ha terminado este documento.
Próximo SlideShare
Single Page Applications with AngularJS 2.0
Siguiente
Próximo SlideShare
Single Page Applications with AngularJS 2.0
Siguiente

Compartir

AngularJS 2.0

My presentation about the future of AngularJS at the monthly meeting of CopenhagenJS user group.

AngularJS 2.0

  1. 1. Boyan Mihaylov @bmihaylov linkedin.com/id/bmihaylov AngularJS 2.0
  2. 2. / M.Sc. in Computer Science @ The University of Copenhagen / 7+ years professional experience / 3 years in Ebita / Conference speaker & university lecturer / Interests / Software architecture / Design patterns & architecture tactics / API development / Web 2 Boyan Mihaylov
  3. 3. Agenda / The status quo / Governing principles / The changing Web / AngularJS 2.0 / ECMAScript 6 / Changes
  4. 4. The status quo / Current stable version is 1.3 / 1100+ contributors to the project on GitHub / Companies like Google, Amazon, HBO, Netflix are slowly switching to AngularJS Google Trends for the term ‘angularjs’
  5. 5. Governing principles D.R.Y. Structure Testability
  6. 6. The changing Web Mobile, mobile, mobile WebComponents.org ECMAScript 6 Evergreen browsers
  7. 7. AngularJS 2.0 AngularJS 1.X is built for current browsers while AngularJS 2.0 is being built for the browsers of the future. Igor Minaz, AngularJS Team
  8. 8. AngularJS 2.0 / In process of research and define the version / Design documents are public and everyone can contribute / Mobile-first, performance, modularity / Browsers of the future = evergreen browsers = always up-to-date browsers / More declarative by the use of annotations / Based on ECMAScript 6 + additional markup / Annotations / Types
  9. 9. ECMAScript 6 / Still in draft / JavaScript.next-to-JavaScript-of-today compiler: Traceur https://github.com/google/traceur-compiler / Module-first design / Classes / Lambdas / …
  10. 10. Changes: change detection / Ultimate goal: Object.observe() / Asynchronously observing changes to JavaScript objects without the need for a separate library / Part of ECMAScript 7 specifications / Works already in Chrome 36+ and Opera 26+ / Watchtower.js / https://github.com/angular/watchtower.js / Performs faster than the current solution / Can be used today 
  11. 11. Changes: dependency injection / No more a global module repository / Calls to angular.module() will always return a new module / Based on ES6 + annotations ← Before After →
  12. 12. Changes: templating (1) / Simpler definition of directives / Integration with other component frameworks via WebComponents.org / Allow IDEs to identify and validate templates / Three types of directives / Decorator directive – decorates existing elements (e.g., ng-show) / Template directive – turns the element they are on into a template (e.g., ng-repeat, ng-include, ng-view) / Component directive – encapsulates logic (JavaScript, HTML, CSS) into a reusable component
  13. 13. Changes: templating (2) Binding to properties instead of attributes Event handlers Interpolations
  14. 14. Changes: templating (3) / Another proposition for syntax / [attribute] – one way binding / [attribute|name] – same as above but also specifies a local variable name to be used by the template / (event) – attach an event handler / (^event) – attach a bubbling event handler / ${expression} – interpolations (always convert to a string)
  15. 15. Changes: persistence (1) As a gamer, I want to play board games with my friends in multiplayer over the web. As I play the game, I want to be able to chat with my friends, as well as make sure my moves are propagated in real time to other players in the game. I want to be notified if the game goes offline and I shouldn’t be able to make any moves until the game state has caught up to the current state again.
  16. 16. Changes: persistence (2) / Right now we have only $http and $resource / Mobile apps need to work in an “always offline” mode / Access to network state / Easier communication with RESTful services Model IAdapter ChangeEvent $localDB $sessionStorage$localStorage $indexedDB$http $webSocket $appCache $serviceWorker $connection Module ngData Module ngOffline Module ngWebSocket Module ngHttp Module ngStore Phase 1 Phase 2 Phase 3
  17. 17. DEMO https://github.com/omeganet/Employee-Register-POC
  18. 18. References / AngularJS 2.0 http://angularjs.blogspot.dk/2014/03/angular-20.html / AngularJS 2.0 Status and Preview http://ng-learn.org/2014/03/AngularJS-2-Status-Preview/ / AngularJS 2.0 Design Docs https://drive.google.com/?pli=1#folders/0B7Ovm8bUYiUDR29iSkEyMk5pVUk / ECMAScript 6 Draft http://people.mozilla.org/~jorendorff/es6-draft.html
  • PeterHan3

    May. 30, 2016
  • ewey27

    Jan. 9, 2016
  • baagiizuna

    Jun. 30, 2015
  • shinichitomita

    Feb. 15, 2015

My presentation about the future of AngularJS at the monthly meeting of CopenhagenJS user group.

Vistas

Total de vistas

2.857

En Slideshare

0

De embebidos

0

Número de embebidos

40

Acciones

Descargas

0

Compartidos

0

Comentarios

0

Me gusta

4

×