PWA

PWA – Progressive Web Applications

Des bases solides pour développer des progressive web applications.

✓ Formation officielle SFEIR InstituteNiveau Intermédiaire⏱️ 2 jours (14h)

Ce que vous allez apprendre

  • Comprendre les concepts des PWA et leur environnement de développement
  • Maîtriser les Service Workers pour les capacités hors ligne et la gestion des événements
  • Mettre en œuvre des stratégies de cache pour la performance et l'accès hors ligne
  • Utiliser les fonctionnalités avancées des Service Workers comme les notifications push et la synchronisation en arrière-plan
  • Rendre une application installable avec un Web App Manifest
  • Intégrer des fonctionnalités de la plateforme native (Géolocalisation, Notifications)
  • Améliorer la performance de l'application en utilisant les meilleures pratiques (pattern PRPL)

Prérequis

  • Bases de la programmation d'application web (ES6)
  • Connaissances de base en Git
  • Expérience en développement front-end avec NPM
  • Avoir installé nodejs (LTS), git, un éditeur de code (VS Code recommandé) et des navigateurs à jour (Chrome, Edge, Safari, Firefox)

Public cible

  • Développeurs, Intégrateurs, Architectes logiciel, Chefs de projet technique

Programme de la Formation

9 modules pour maîtriser les fondamentaux

Sujets abordés
  • →Origines du concept
  • →Définition du terme F.I.R.E.
  • →Environnement de développement et de débogage
  • →Point sur les exercices à venir
  • →Point sur la sécurité dans les applications web
Activités

Mise en place d'un environnement de développement PWA

Sujets abordés
  • →Fonctionnement des services workers
  • →Installation d'un service worker
  • →Compréhension du cycle de vie d'un service worker et comment agir sur le cycle de vie
  • →Manipulation des events du service worker: event ‘install’, ‘activate', ‘fetch'
Activités

Installer un premier service worker

Débogage d'une PWA

Prendre le contrôle des événements

Découvrir les événements ‘install', 'activate' et 'fetch'

Sujets abordés
  • →Présentation du concept d'App-shell
  • →Découverte de l'API de cache du service worker
  • →Découverte des stratégies de cache
  • →Découverte du mode offline
  • →Présentation de Workbox
Activités

Mettre en place un app-shell

Rendre notre application disponible hors ligne

Manipuler le cache d'un service worker

Utilisation de Workbox pour gérer son cache

Sujets abordés
  • →Découverte de l'event ‘message’
  • →Découverte de l'évent 'sync'
Activités

Mise en place d'une communication cross onglets basée sur l'événement 'message'

Mise en place du background-sync pour l'envoi de messages

Sujets abordés
  • →Présentation du manifest
  • →Présentation des enjeux de l'installation d'une PWA
  • →Comment rendre une PWA disponible sur les Stores
Activités

Création d'un manifest et installation de l'application

Sujets abordés
  • →Présentation des concepts d'UX de l'engagement utilisateur
  • →Utilisation de l'événement ‘push' du service worker
  • →Découverte des notifications web
  • →Comment débugger une notification
Activités

Mise en place d'une notification avec Action

Mise en place d'un système de Push notification

Sujets abordés
  • →Découverte des possibilités d'intégration d’API “Natives” : Géolocalisation, FullScreen
  • →Authentification simplifiée avec webAuthN
  • →PaymentRequest API
  • →Liste des APIs disponibles
  • →Design Responsive
Activités

Utilisation de l'api de géolocalisation, fullscreen

Mise en place d'une authentification WebAuthN

Sujets abordés
  • →Retour sur les formats d'images à utiliser et les techniques associées
  • →Bonnes pratiques de la performance web
  • →Présentation du pattern P.R.P.L.
Activités

Mise en place du P.R.P.L pattern

Sujets abordés
  • →Liste d'outils pouvant aider à la réalisation d'une PWA
  • →CLI Angular, Vue, React, ...
  • →Présentation de Workbox
Activités

Audit avec LightHouse CI

Formations associées

SFEIR Institute
Best

Angular

Angular n'est pas qu'un simple framework populaire — c'est l'épine dorsale des applications web d'entreprise mondialement utilisées. En 2026, alors que les outils de développement basés sur l'IA deviennent essentiels à la productivité, cette formation va au-delà de l'enseignement de la syntaxe Angular. Nos formateurs experts (Google Developers Experts, contributeurs du framework Angular et mainteneurs de NG-ZORRO) vous enseigneront comment exploiter les outils LLM comme Claude pour accélérer votre développement. Mais voici la différence critique : **utiliser un LLM ne signifie pas accepter aveuglément le code généré**. Cette formation insiste sur la compréhension de chaque ligne produite, ce qui vous permet de déboguer, optimiser et maintenir efficacement vos applications. Que vous soyez développeur frontend ou ingénieur full-stack, vous apprendrez à : - Créer des applications Angular robustes et évolutives avec les patterns modernes (signaux, composants autonomes, architecture composable) - Écrire des tests avec 100% de couverture pour garantir la maintenabilité à long terme - Maîtriser l'écosystème Angular (injection de dépendances, routage, formulaires, gestion d'état avec NgRx Signal Store) - Être productif avec le développement assisté par IA tout en maintenant une compréhension complète de votre codebase À la fin, vous aurez une expérience pratique avec une application complète de répertoire de personnel construite progressivement à travers les exercices, vous pourrez passer les certifications Angular Training Level 1 & 2, et surtout — vous obtiendrez l'expertise pour construire des applications prêtes pour la production qui durent.

4 j
Intermédiaire

Prochaines sessions

19 novembre 2026
Distanciel • Français
S'inscrire

Processus Qualité

L'engagement de SFEIR Institute : une démarche d'excellence pour garantir la qualité et la réussite de toutes nos formations. En savoir plus sur notre démarche qualité

Méthodes pédagogiques mobilisées
  • Lectures / Apports théoriques (Slides) — Présentation de concepts via des supports visuels (PowerPoint, PDF).
  • Démonstration technique (Démos) — Le formateur réalise une manipulation ou une procédure devant les apprenants.
  • Laboratoires dirigés (Labs) — Mise en pratique guidée sur logiciel, machine ou environnement technique.
Dispositif d'évaluation et de suivi

L'atteinte des objectifs de la formation est évaluée à plusieurs niveaux pour garantir la qualité de la prestation :

  • Évaluation continue des acquis : Vérification des connaissances tout au long de la formation via des méthodes participatives (en fonction de la formation: quiz, exercices pratiques, mises en situation) sous la supervision du formateur.
  • Mesure de la progression : Dispositif d'auto-évaluation comparatif comprenant un diagnostic initial pour situer le niveau de départ, suivi d'une évaluation finale pour valider l'évolution des compétences.
  • Évaluation de la qualité : Questionnaire de satisfaction en fin de session pour mesurer la pertinence et l'efficacité de la formation ressentie par les participants.

1 580€ € HT

par apprenant