Développement web avec Angular

Angular, maîtriser le Framework Front-End de Google

28 heures 0 mins

Développement web avec Angular

Objectifs de la formation

  • Organiser, modulariser et tester ses développements JavaScript
  • Maîtriser les fondamentaux du Framework Angular
  • Créer rapidement des applications Web complexes
  • Savoir intégrer les tests unitaires au développement
  • Connaître les bonnes pratiques de développement et de mise en production
  • Mettre en œuvre la programmation réactive (RxJS et Signals)

Programme de la formation

Développement JavaScript : rappels

  • Évolutions majeures d’ECMAScript (ES6 à aujourd’hui).
  • Classes, modules, fonctions fléchées, promesses, async/await.
  • Introduction à TypeScript : typage statique, interfaces, décorateurs.
  • Les décorateurs avec TypeScript 5.x.

Travaux pratiques

Installation et configuration de l’environnement (Node.js, Angular CLI, VS Code).

Les fondamentaux d’Angular

  • Architecture et cycle de développement d’une application Angular.
  • Utilisation de l’Angular CLI (basé sur esbuild / Vite).
  • Composants, templates, data binding et event binding.
  • Les control flow @if, @for…
  • Directives et pipes. Composition de directives.
  • Gestion du style et encapsulation.
  • Standalone Components : organisation des projets avec composants autonomes

Travaux pratiques

Création d’une mini-application interactive.

La programmation réactive

  • Principes de la programmation réactive.
  • Observables et opérateurs RxJS.
  • Souscriptions et gestion de l’asynchronisme.
  • Le mode Zoneless.
  • Découverte des Signals, nouvelle API réactive native.
  • Complémentarité entre RxJS et Signals.

Travaux pratiques

Flux de données réactifs dans l’application.

Composants avancés et services

  • Communication Input Signal / Output Signal.
  • Cycle de vie des composants.
  • Utilisations des annotations.
  • Décorateurs avancés (@ViewChild, @ContentChild, @Host…).
  • Equivalences fonctionnelles basées sur les Signals.
  • Les formulaires : Reactive Forms, FormControl et FormGroup.
  • La validation des formulaires.
  • Hiérarchie des injecteurs.
  • Intégration optimisée des services avec les Standalone Components.

Travaux pratiques

Structurer une application multi-composants.

« Routing » et requête HTTP

  • Configuration et gestion du Router Module.
  • Navigation, liens dynamiques, paramètres et guards.
  • Requêtes HTTP (GET, POST, PUT, DELETE).
  • Intercepteurs, gestion d’erreurs, authentification.
  • Simplifications du router (Inputs/Outputs de route).
  • Support renforcé du SSR et de l’hydration progressive.
  • Nouvelle classe HTTPClient / API Resource.

Travaux pratiques

Communication avec une API REST.

Tests et qualité du code

  • Présentation de l’écosystème de test Angular CLI (Karma + Jasmine).
  • Structuration des tests unitaires et d’intégration.
  • Analyse de couverture et intégration CI/CD.
  • Présentation de Vitest.

Travaux pratiques

Mise en place de tests unitaires sur composants et services.

Déploiement et bonnes pratiques

  • Commandes de build et optimisation (esbuild, tree-shaking, minification).
  • Variables d’environnement et gestion de configuration.
  • Publication d’une application Angular sur serveur ou hébergement statique.
  • Introduction au SSR (Server-Side Rendering) et à l’hydration progressive.
  • Bonnes pratiques de performance et accessibilité (A11y).
  • Introduction de l’IA intégrée depuis Angular 20.2

Travaux pratiques

Build et mise en production de l’application fil rouge.

MOYENS PÉDAGOGIQUES ET TECHNIQUES D’ENCADREMENT DES FORMATIONS

Modalités pédagogiques :

  • Évaluation des besoins et du profil des participants.
  • Apport théorique et méthodologique : séquences pédagogiques regroupées en différents modules.
  • Contenus des programmes adaptés en fonction des besoins identifiés pendant la formation.
  • Le formateur évalue la progression pédagogique du participant tout au long de la formation au moyen de travaux pratiques, étude de cas et mise en situation.
  • Méthodes expositive, active et participative.
  • Réflexion et échanges sur cas pratiques.
  • Retours d'expériences.
  • Corrections appropriées et contrôles des connaissances à chaque étape, fonction du rythme de l’apprenant mais également des exigences requises au titre de la formation souscrite.

Éléments matériels :

  • Mise à disposition des outils nécessaires au bon déroulement des travaux pratiques.
  • Support de cours au format numérique projeté sur écran et transmis au participant en fin de la formation.

Référent pédagogique et formateur :

  • Chaque formation est sous la responsabilité du directeur pédagogique de l’organisme de formation.
  • Le bon déroulement est assuré par le formateur désigné par l’organisme de formation.
MOYENS PERMETTANT LE SUIVI ET L’APPRÉCIATION DES RÉSULTATS
  • Feuilles de présences signées des participants et du formateur par demi-journée.
  • Attestation de fin de formation mentionnant les objectifs, la nature et la durée de l’action et les résultats de l’évaluation des acquis de la formation.
Please login to get access to the quiz
(Next Lesson) Angular, développement avancé
Back to Développement web avec Angular
Public

Architectes, développeurs et chefs de projets.

Pré-requis

Bonnes connaissances des technologies du Web et des outils modernes de développement Front-End. Connaissances de JavaScript.

Vérifiez que vous avez les prérequis nécessaires pour profiter pleinement de cette formation en effectuant le test disponible en bas de cette page.

Lieu de formation

Intra-entreprise/à distance

Dates ou période

À définir. Nous consulter

Tarif

Sur devis. Merci de nous contacter

Modalités

Pour s’inscrire à notre formation, veuillez nous contacter par mail ou téléphone.

Démarrage de la formation sous deux semaines (délai indicatif).

Nous contacer
training@profind.fr
Informations complémentaires

Pour toute réclamation, aléas ou difficultés rencontrés pendant la formation, veuillez prendre contact avec notre organisme par téléphone ou par e-mail. Nous mettrons tout en œuvre pour trouver une solution adapter.

Formation synchrone, réalisée à distance en visioconférence via l’application Microsoft Teams ou en présentiel dans les locaux du client.

Sur le même thème