Accueil > Technologies WEB > Angular : maîtriser le framework Front-End de Google
Formation #TWC100

Formation Angular : maîtriser le framework Front-End de Google

Durée : 5 jours

Code : TWC100


Prochaines dates programmées :

Du 10 au 14 Juin 2024

Du 16 au 20 Sept. 2024

Du 23 au 27 Déc. 2024

Fin d'Inscription :
Le Bulletin d'Inscription doit être rempli, cacheté, signé et envoyé par email : Au minimum 15 JOURS OUVRÉS avant la date de formation.
Si vous avez un besoin URGENT et que vous souhaitez une date de formation plus proche que les sessions programmées (minimum 15 à 20 jours ouvrés à date de votre demande)

Objectifs

  • Maîtriser les fondamentaux du Framework Angular
  • Etre capable de concevoir des applications propres et robustes
  • Savoir intégrer les tests unitaires au développement
Programme
1/ Introduction
  • Décryptage de la philosophie voulue par Google
  • Les apports d’Angular dans le monde du développement web
  • Versionning : d’AngularJS à Angular
  • Comprendre la notion de Web components du W3C (custom elements, shadow DOM, HTML templates et imports)
  • ES7/ES6/ES2015 : ce qu’il faut savoir avant de démarrer sur Angular
2/ Présentation du Framework
  • La nouvelle version d'Angular
  • Les nouveautés de TypeScript 3.8
  • Le nouveau moteur d'Angular 9 : Ivy
  • Compilation AOT vs JIT
3/ La structure du framework
  • Concepts fondamentaux et vue d’ensemble de l’architecture : composants, services, vues…
  • Comment est organisée une application Angular ?
  • Organisation du code avec les modules : les conteneurs NgModules et l’encapsulation
  • Templates, les nouvelles syntaxes
  • Fonctionnement du databinding pour gérer les données dynamiques
  • Rôles des pipes et directives
  • Principes de l’injection de dépendances avec Angular
4/ Migrer d'AngularJS 1.x à Angular
  • Comparaison et "topographie" des concepts
  • Préparer la migration. Structure d'une application Angular
  • Les modules Angular, "core" et principaux modules
  • Principe de l'injection de dépendance
  • Classification des directives : composant, attribut, structure
  • Les décorateurs : définition des hiérarchies
5/ L'utilitaire ng ou @angular/cli
  • Utilisation de l'utilitaire en ligne de commande
  • Scaffolder une structure de projet : anatomie et dépendance
  • Configuration des utilitaires de tâches
  • Configuration et commandes clés
  • Lancer un server de développement/production (build)
  • Compilation Ahead of Time. La notion de "Tree Shaking"
  • Gestion des modules : bonnes pratiques
  • BootStrap d'application
6/ Définition de composants
  • Comprendre les Web Components. (standard, concepts, shadow DOM, scoped CSS...)
  • Cycle de vie dans l'application
  • Angular Compiler : Change Detection
  • Syntaxe des templates : interpolation/expression, "Binding" et filtres
  • Directives de transformation : ngIf, ngFor, ngSwitch...
  • Définition syntaxique, le symbole (*)
  • Variables locales et variables de Template
  • Classe de composants. Directives de configuration : selector, provider
  • Evénements utilisateur et événements logiques personnalisés : EventEmitter
7/ Classifications des composants applicatifs
  • Module, RouterModule, SharedModule
  • Component, Directive, Pipe, Service, Guard
  • Principe de l'injection de dépendances
  • Création de services injectables. Classification des services
  • Configuration de l'injecteur
  • Les décorateurs et leurs propriétés en détails
  • @Host, @ContentChild, @ViewChild
  • JavaScript Pure function, PurePipe
8/ Formulaires
  • Les différentes façons de créer des formulaires : template-driven ou reactive ?
  • Comprendre la gestion du flux de données
  • Valider et gérer les erreurs : considérations pour la sécurité
  • Créer des validateurs personnalisés et les ajouter à un formulaire
9/ Routing, navigation et requête HTTP
  • Vue d’ensemble du routage Angular
  • Liaison de données via HTTP
  • Gestion et configuration des échanges HTTP au niveau applicatif
  • Déclarer et configurer des routes et URLs
  • La navigation avec routerLink et navigate
  • Paramètres de routes
  • Gérer les redirections
  • Configurer des guards
10/ Les Observables et la bibliothèque RxJS
  • Concepts de programmation réactive
  • Angular et RxJS (Reactive Extensions for JavaScript)
  • Comprendre et utiliser les observables et observateurs
  • L’intérêt des Subjects
  • Les principaux opérateurs : map(), filter(), throttleTime(), scan() et reduce()
  • Gestion des requêtes HTTP avec l’API HttpClient
11/ Tests
  • Configurer l’environnement de test
  • Karma et Jasmine
  • Utiliser Protractor pour des tests end-to-end
12/ Bonnes pratiques et outils pour tester sous Angular
  • Couverture du code. Indices du code-coverage
  • BDD Behaviour Driven Developpemnt, TDD Test Driven Developpement
  • Cas de test : pipe, composant, application
  • Angular "Coding guide Style"
Approche Pédagogique

Approche Pédagogique

  • Pédagogie très opérationnelle fondée sur l'alternance entre théorie et pratique
  • Cas pratiques
  • Remise d’outils
  • Echanges d’expériences
Public Cible

Personnes Visées

  • Architectes
  • Chefs de Projet
  • Développeurs
Dates

Dates

  • Du 10 au 14 Juin 2024
  • Du 16 au 20 Sept. 2024
  • Du 23 au 27 Déc. 2024
  • Fin d'Inscription :
    Le Bulletin d'Inscription doit être rempli, cacheté, signé et envoyé par email : Au minimum 15 JOURS OUVRÉS avant la date de formation.