Téléchargé 59 fois
Téléchargé parRomain Linsolas
Devoxx France 2015 - Se préparer à l'arrivée d'Angular 2
Le document présente une synthèse des évolutions d'Angular, notamment la transition vers Angular 2 avec une refonte complète des concepts précédents. Il met en avant l'importance d'apprendre TypeScript, de maîtriser les directives, et de suivre les actualités liées aux mises à jour d'Angular. Enfin, il propose des alternatives à Angular et des conseils pour ceux qui choisissent de rester sur la version 1.
Contenu connexe
![[DevoxxFr] Savoir faire le deuil de son code](https://cdn.slidesharecdn.com/ss_thumbnails/savoirfaireledeuildesoncode-150515050524-lva1-app6891-thumbnail.jpg?width=640&height=640&fit=bounds)
Similaire à Devoxx France 2015 - Se préparer à l'arrivée d'Angular 2
Devoxx France 2015 - Se préparer à l'arrivée d'Angular 2
- 1. @romaintaz#DvxFrAngular2 Se préparer à l'arrivée d'Angular 2
- 2.
- 3. @romaintaz#DvxFrAngular2 Bref historique 2009 2010 2011 2012 2013 2014 2015 2016 1e release 1.0– 1.1 1.2 1.3 1.4 – 1.5 2.0 ∝ 𝛽
- 4.
- 6. @romaintaz#DvxFrAngular2 Adieu, concepts de la v1 ! • angular.module • $scope • Controllers • Directive Definition Objects • jqLite
- 7. @romaintaz#DvxFrAngular2 La v2, une refonte complète • Dependency injection • Templating • Routing • Logging • Persistence • Annotations • Benchmarking / monitoring • Etc.
- 8.
- 9.
- 10.
- 11. @romaintaz#DvxFrAngular2 Qu’est-‐ce que ? •Supporte la spécification ECMAScript 6 (surtout TS 1.5) • Introduction des decorators dans 1.5
- 12. @romaintaz#DvxFrAngular2 TypeScript – Quelques bases // Typage statique var myFlag: boolean = true; var myString: string = "Hello Devoxx France!"; var theAnswer: number = 42; function whatIsTheAnswer(): number { return 42; } // Enumeration (avec ou sans valeur) enum Conference { Devoxx, DevoxxFrance, MixIT }; enum Color { Blue = 0, White = 1, Red = 2 };
- 13. @romaintaz#DvxFrAngular2 TypeScript – Classes & interfaces // interfaces interface Conference { name: string; welcome(): string; } class DevoxxFrance implements Conference { name: string; constructor(name: string) { this.name = name; } welcome(): string { return "Welcome to " + this.name; } }
- 14.
- 15. @romaintaz#DvxFrAngular2 Directives Driven Development <!--page.html --> <div ng-controller=”HomeCtrl”> Hello {{ username }} </div> // Controller myApp.controller(“HomeCtrl”, function($scope) { $scope.username = “World !”; }); <!-- page.html --> <hello-message></hello-message> <!-- hello-template.html --> </span>Hello {{ username }}</span> // Directive myApp.directive(“helloMessage”, function() { return { restrict: ‘E’, templateUrl: ‘hello-template.html’, link: function(scope, element, attrs) { scope.username = ‘World !’; } } });
- 16. @romaintaz#DvxFrAngular2 Directives Driven Development <!--page.html --> <hello-message></hello-message> <!-- hello-template.html --> </span>Hello {{ username }}</span> // Directive myApp.directive(“helloMessage”, function() { return { restrict: ‘E’, templateUrl: ‘hello-template.html’, link: function(scope, element, attrs) { scope.username = ‘World !’; } } }); <!-- page.html --> <div ng-controller=”HomeCtrl”> Hello {{ username }} </div> // Controller myApp.controller(“HomeCtrl”, function($scope) { $scope.username = “World !”; });
- 17.
- 18. @romaintaz#DvxFrAngular2 Actualités d’Angular • Suivrel’évolution d’Angular 2 • Sites (https://angular.io), blogs… • Conférences : Devoxx (France), ng-london (mi-octobre) • …mais aussi de la v1 : v1.5 prévue pour faciliter la migration
- 19. @romaintaz#DvxFrAngular2 D’autres idées ? •Rester sur la v1 : § Encore 3 ans de support § Grande communauté § Pas de grosses évolutions (ES6, Web Components…) • Quitter Angular : § Ember.js § Backbone.js § Aurélia…
- 20.
- 21. @romaintaz#DvxFrAngular2 Pour bien se préparer • Apprenez le TypeScript • Maîtrisez les directives • Suivez de près l’évolution d’Angular 2 (et de la v1)
- 22.