Formation Angular Avancé
Notre formation Angular Avancé s'inscrit dans la continuité de la formation Angular. Elle intéressera les développeurs ou les chefs de projets qui souhaitent découvrir des techniques avancées, optimiser les performances de leurs applications, automatiser les tests ou découvrir NgRx, une bibliothèque de gestion de state.
Objectifs pédagogiques / Compétences visées
- Avoir des notions sur le fonctionnement interne d'Angular
- Connaître les concepts avancés des composants, du routeur, des services
- Optimiser les performances de son application
- Utiliser les techniques avancées comme le rendu côté serveur ou mode hors-ligne
- Automatiser les tests de son code
- Découvrir NgRx pour gérer le state de son application
Pré-requis
- Avoir suivi ou être au niveau de notre formation Angular
Public
- Développeurs
- Chefs de projets
Programme
Jour 1
Rappels sur Angular
- Data Binding, Template et Model
- Modules
- Services
- HttpClient
- Router
Angular sous le capot
- Détection de changement
- Zone.js
- Compilation JIT vs AOT
- Les plates-formes
- Configurer Angular CLI
- Schematics
- Builders
- Modifier la configuration de Webpack
Optimisation des performances
- Minification et Tree-Shaking
- Immuabilité
- ChangeDetectionStrategy Default et OnPush
- Exécuter du code en dehors de Zone.js
- Utiliser du Virtual Scroll
- TrackBy avec ngFor
Composants Avancé
- ViewChild / ContentChild et Lifecycles correspondant
- Composants Dynamiques
- ng-container / ng-template / ngTemplateOutlet
- TemplateRef
Internationalisation (i18n)
- Angular CLI vs ngx-translate
- Utiliser des traductions dans les templates
- Extraire les clés de traductions
- Formater les nombres, dates, monnaies
- Charger les traductions dynamiquement
Jour 2
Techniques Avancées
- Mettre à jour Angular
- Rendu côté serveur
- Mode hors-ligne / ServiceWorker / Applications PWA
- Créer sa bibliothèque
- Transformer un composant en WebComponent
RxJS Avancé
- Les principaux opérateurs : tap, take, filter, map, debounceTime, catchError...
- Les opérateurs de combinaison : combineLatest, switchMap, withLatestFrom...
- Les méthodes de création : of, from, fromEvent, throwError, timer...
- Les subjects : Subject, ReplaySubjet, BehaviorSubject, AsyncSubject
Services Avancé
- Configurer les providers : useClass, useFactory, useValue, useExisting
- Tree Shakable Providers
- Injecter autre chose qu'une classe avec @Inject
- Modules avec méthodes forRoot / forChild
Angular Router Avancé
- Les guards : CanActivate, CanActivateChild, CanDeactivate
- Les resolvers
- Les modules en Lazy Loading et le guard CanLoad
- Les événements du Router
Jour 3
Tests Unitaires
- Les bibliothèques de tests unitaires en JS : Karma, Jasmine, Mocha, Jest...
- Introduction à Karma + Jasmine
- Configurer ses modules de tests
- Tester des composants, directives, pipes, services
- Les zones async et fakeAsync
- Tester les services HTTP avec HttpClientTestingModule et HttpTestingController
- Tester les changements d'URL avec RouterTestingModule
- Utilisation de ng-mocks
Tests End-To-Ends (E2E)
- Les bibliothèques de tests E2E en JS : Selenium WebDriver, WebdriverIO, Protractor, CodeceptJS, Cucumber.js, Cypress...
- Le pattern Page Object
- Utiliser les sélecteurs CSS ou XPath
- Simuler des événements
- Utiliser les environnements pour fournir des données de tests
- Exécuter ses tests sur Browserstack ou Sauce Labs
Jour 4
State Management sous Angular
- Qu'est-ce qu'un State ? Intérêts par rapport aux services "classiques"
- Les concepts de Redux : store, actions, reducers, constants, action creators, selectors, effects
- Les bibliothèques Redux-like sous Angular : NgRx, NGXS, Akita, Angular Redux
- Utilisation de Redux DevTools
NgRx
- Penser et créer son store
- Les observables dans NgRx
- Ecrire ses premiers action creators, reducers, selectors
- Les meta-reducers
- Gérer les side-effects avec @ngrx/effects
- S'intégrer au Routeur avec @ngrx/router-store
- Automatiser ses tests en lien avec NgRx
Moyens pédagogiques et techniques
- Formateur validé par nos équipes techniques et pédagogiques
- Salle de formation informatisée
- Support de cours numérique
Suivi et appréciation des résultats
- Questions orales ou écrites (QCM)
- Exercices pratiques
- Formulaires d'évaluation
Dernière modification le 13/05/2021