Cette formation complète vous prépare à développer des applications Web robustes et optimisées avec le framework Angular et le langage TypeScript.
Apprenez à démarrer un projet, comprendre les fichiers de configurations, intégrer des librairies externes, et utiliser efficacement les scripts et outils de construction.
Maîtrisez les composants et templates, le data binding, la gestion des événements, ainsi que la création et validation de formulaires.
Parcourez la mise en place des routes pour une navigation efficace, la création de services injectables, et la communication avec le serveur via AJAX.
Découvrez des notions avancées sur les composants et la structuration du code en modules.
Mettez en pratique ces compétences en créant une application bancaire de gestion de comptes et clients.
La formation couvre également l’utilisation de PostMan pour tester une API, l’utilisation des Observer et Observables, et la communication avec un serveur Cloud, notamment Firebase de Google.
Inclus dans votre formation en inter-entreprise
Programme détaillé
Introduction
- HTML5 et JavaScript
- Principes et architecture d’une Single Page Application
- Comparaison AngularJS / Angular
- Outils et installation
Démarrer un projet
- Utilisation de NodeJS
- Langage TypeScript et outils associés
- Modules et dépendances
- Mise en place d’un serveur de développement
Structure du projet Angular
- Fichiers de configurations
- Modules, import, export et provider
- Intégration de librairie externe CSS ou JavaScript
- Scripts et outils de construction/packaging
Composants et templates
- Application et composant
- Template et expressions
- Data Binding
- Gestion d’événements
- Directives de structure
- Pipes et formatage
Formulaires
- Lier le formulaire au modèle
- Valider les champs
- Gérer les erreurs
- Regroupement d’items
- Création de formulaire dynamique (ReactiveForm)
Navigation dans l’application
- Principe des routes
- Module Router
- Configuration des routes
- Navigation dans l’application
Services
- Injections de dépendances
- Créer des services injectables
- Structurer ses services
- Visibilité des fonctions
Communication avec le serveur
- Requêtes AJAX avec le module HTTP
- Programmation réactive pour manipuler la requête
- Objets « observable »
- Filtrer et transformer les données avec RxJS
Notions avancées sur les composants
- Créer des composants réutilisables
- Communication inter-composants
- Paramétrage @Input et @Output
- Manipuler le DOM avec @ViewChild
- Stratégies de détection du changement
- Gestionnaire d’états @ngxs
- Structurer son code en modules
Tester l’application
- Présentation du framework de test
- Ecriture de tests unitaires
- Scénario de tests d’intégration
- Exécution des tests
[Option] Material Design
- Configuration du projet pour Material
- Présentation des composants
- Intégration des principaux composants
- Personnalisation du thème
[Option] Internationalisation
- L’API i18n d’Angular
- Attributs i18n et attributs personnalisés
- Gestion des singuliers et pluriels
- Création de fichiers de traduction
Travaux pratiques
- Création d’une application bancaire de gestion de comptes et de clients
- Mise en place du projet
- Création d’un premier composant
- Ajout d’un formulaire de création d’un nouveau client
- Mise en place de la navigation dans l’application
- Création de services métiers de persistance locale
- Connexion de l’application à un service Web REST
- Création de composants personnalisés réutilisable