03 20 61 95 06

Formation PWA Progressive Web Applications


  • PWA
  • Durée : 2 jours
  • Tarif : 1400 € HT

96%

Taux de satisfaction clients
(sur 1375 évaluations du 19/05/21 au 19/03/24)

Voir les avis

Objectifs

A l’issue de la formation le participant sera capable de :
Compréhension et manipulation des concepts associés aux PWA

Manipulation des outils de débogage d’une PWA

Prérequis

Ce cours suppose que vous ayez déjà les bases de de la programmation d’application web (ES6).

Connaissances de base en Git
Développement front-end avec NPM
Installer nodejs (LTS) : https://nodejs.org/
Installer git : http://git-scm.com/
Votre éditeur favori (nous recommandons Visual Studio Code)
Installer Chrome et au moins un autre browser à jour (Edge, Safari, Firefox)

Cette formation ne peut être financée que dans le cadre d’un projet d’entreprise (prise en charge entreprise ou OPCO). Les dossiers à financement personnel et CPF ne sont pas pris en compte.

Public

Développeurs, intégrateurs, architectes logiciel, chefs de projet technique

Dernière mise à jour

Programme mis à jour le 31 janvier 2024
enveloppe Cette formation vous intéresse ? Contactez-nous

Bon à savoir

Evaluez votre niveau

Pour vous aider à bien choisir votre formation, nous vous proposons soit un entretien avec le formateur soit un test d’évaluation. Cela vous assurera que vous disposez des connaissances nécessaires pour suivre la formation dans des conditions optimales.

Formations modulables

Toutes nos formations sont disponibles en présentiel comme en distanciel, en mode coaching individuel ou en groupe de 3 à 6 participants maximum.

Travaux pratiques

Nos formations comprennent de nombreux travaux pratiques pour un meilleur apprentissage (60 % de pratique). Nous proposons également de travailler sur vos données pour une meilleure expérience.
modules

Les Modules
de formation

Module1
Introduction

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
Atelier: Mise en place d’un environnement de développement PWA
Module2
Manipulation des Services Workers

Fonctionnement des services workers

Installation d’un service worker
Compréhension du cycle de vie d’un service worker. Comment agir sur le cycle de vie
Manipulation des events du service worker: event ‘install’, ‘activate’, ‘fetch’
Ateliers:
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’
Module3
Gestion des stratégies de cache

Présentation du concept d’App-shell

Découvrons l’API de cache du service worker
Découverte des stratégies de cache
Découverte du mode offline
Présentation de Workbox
Ateliers:
Mettons en place un app-shell
Rendons notre application disponible hors ligne
Manipulons le cache d’un service worker
Utilisation de workbox pour gérer son cache
Module4
Aller plus loin avec le service worker

Découverte de l’event ‘message’

Découverte de l’évent ‘sync’
Ateliers:
Mise en place d’une communication cross onglets basé sur l’événement ‘message’
Mise en place du background-sync pour l’envoi de messages
Module5
Rendre l’ application installable

Présentation du manifest

Présentation des enjeux de l’installation d’une PWA
Comment rendre une PWA disponible sur les Stores
Atelier: Création d’un manifest et installation de l’application
Module6
Engageons notre utilisateur

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
Ateliers:
Mise en place d’une notification avec Action
Mise en place d’un système de Push notification
Module7
Intégration à la plateforme

Découverte des possibilités d’intégration d’API “Natives” : Geolocalisation, FullScreen

Authentification simplifiée avec webAuthN
PaymentRequest API
Liste des APIs disponibles
Design Responsive
Ateliers:
Utilisation de l’api de geolocalisation, fullscreen
Mise en place d’une authentification WebAuthN
Module8
Améliorer la performance de l’application

Retour sur les formats d’images à utiliser et les techniques associées

Bonne pratiques de la performance web
Présentation du pattern P.R.P.L.
Atelier: Mise en place du P.R.P.L pattern
Module9
Tour des outils pouvant nous aider

Liste d’outils pouvant aider à la réalisation d’une PWA

CLI Angular, Vue, React, …
Présentation de Workbox
Atelier: Audit avec LightHouse CI

Les prochaines
sessions de formation

Sur demande
Vous souhaitez organiser cette formation à une date spécifique ?Contactez-nous en remplissant le formulaire ci-dessous
29 avril 2024
17 juin 2024
12 août 2024
07 octobre 2024

Cette formation vous intéresse ? Contactez-nous !

    Les données personnelles collectées sont destinées à Access IT Company et utilisées pour traiter votre demande et, lorsque vous ne vous y êtes pas opposé, vous communiquer nos offres commerciales. Les données obligatoires vous sont signalées sur le formulaire par un astérisque. L’accès aux données est strictement limité par Access IT Company aux collaborateurs en charge du traitement de votre demande. Conformément au Règlement européen n°2016/679/UE du 27 avril 2016 sur la protection des données personnelles et à la loi « informatique et libertés » du 6 janvier 1978 modifiée, vous bénéficiez d’un droit d’accès, de rectification, d’effacement, de portabilité et de limitation du traitement des donnés vous concernant ainsi que du droit de communiquer des directives sur le sort de vos données après votre mort. Vous avez également la possibilité de vous opposer au traitement des données vous concernant. Vous pouvez exercer vos droits en contactant le DPO à l’adresse suivante : [email protected] ou à l’adresse postale suivante 2, Allée Lavoisier, 59650 Villeneuve d’Ascq. Pour plus d’informations sur le traitement de vos données personnelles par Access IT Company, veuillez consulter notre politique de confidentialité disponible sur notre site internet à l’adresse suivante : https://formation.access-it.fr/politique-de-confidentialite/