Formation Progressive Web App (PWA)


REFERENCE
 
 
TPWA
DUREE
 
 
3 jours
TARIFS
 
 
1650 € HT
Niveau : Intermédiaire
Classe à distance: Possible

Vous pouvez suivre cette formation en direct depuis votre domicile ou votre lieu de travail. Plus d'informations sur notre solution de classe à distance...

OBJECTIFS :
 

La notion de « Progressive Web App » (PWA) est encore très récente. Elle consiste à mettre en œuvre un ensemble de nouveaux standards du Web pour apporter aux sites et applications Web les capacités jusqu’ici réservées aux applications mobiles natives ou hybrides : installation locale, performance, fonctionnement offline, notifications push, etc. Cette approche peut être structurante pour un projet web responsive (ou exclusivement mobile) car elle demande une réflexion en amont pour assurer une bonne conception.
Au delà d’une introduction historique et théorique, cette formation pratique apporte les clefs pour la mise en œuvre des Progressive Web Apps.

À l'issue de ce séminaire, les participants seront en mesure de :

  • Appréhender l’état de l’art des Progressive Web Apps
  • Connaître les différentes stratégies de mise en oeuvre des Progressive Web Apps
  • Identifier les composants et outils nécessaires ou facilitant la mise en œuvre de Progressive Web Apps
  • Mettre en œuvre les techniques de conception de Progressive Web Apps
PRÉ-REQUIS :
 

Pour participer à ce cours, vous avez besoin d'une bonne connaissance de l’intégration front-end HTML, CSS et JavaScript.

PUBLIC :
 

Ce cours s'adresse aux professionnels impliqués dans l'élaboration d'un projet mobile Web ou natif, ou à toute personne partie prenante dans la réalisation d’un projet Web : chefs de projet, architectes, développeurs.

PROGRAMME :
 

Introduction

Petit retour sur l’histoire de la mobilité
L’impact de la mobilité sur le Web
Comparatif forces/faiblesses entre applications mobiles natives et Web

Les composants de base des Progressive Web App (PWA)

Un proxy dans le navigateur avec les Service Workers
La sécurité imposée avec HTTPS
Quel support dans les navigateurs ?
La dimension « Progressive » dans les PWA

Principales fonctionnalités des PWA

Accès direct à l’application sans installation
Installation en local de l’application avec le Web App Manifest et la Web App Install Banner
Lancement instantané et rapidité de fonctionnement avec l’architecture app-shell
Fonctionnement même sans réseau (offline) avec les Service Workers
Notifications avec l’API Push
Mise à jour en tâche de fond avec Background Sync

Le Service Worker en détail

Rappels sur quelques API de base : promises, Fetch, ES2015
Le cycle de vie d’un Service Worker
L’installation : téléchargement, périmètre d’action (scope)
La mise à jour
Le déclenchement, les événements pris en charge

Outils pour la mise en œuvre

Bibliothèques, composants et frameworks facilitant le développement : Workbox (ex sw-precache), frameworks intégrant de base les Service Workers
Outils de développement et débogage : devtools des navigateurs, Lighthouse

API Cache : tolérance de défaillance réseau et offline

Les opérations de base sur l’API Cache depuis un Service Worker
Quels contenus peuvent être en cache ?
Gestion du cycle de vie des contenus en cache
Autres moyens de stockage : pas de support localStorage, mais IndexedDB
Une SPA ultra rapide avec l’architecture Application Shell
Accéder au Cache depuis une page

Installation de l’application sur l’appareil

Le Web App Manifest
La Web App Install Banner
Le comportement des différents navigateurs mobiles et desktop

Les notifications

L’API Notifications
L’intégration aux notifications natives de l’OS
La gestion de l’autorisation par l’utilisateur

Le push de données

Pousser des données depuis le serveur avec l’API Push
Mise à jour en tâche de fond avec l’API Background Sync

Autres capacités nouvelles sur le Web pour aller plus loin

Paiement simplifié avec l’API Payment Request
Lecture de QR code avec les API getUserMedia/Stream et Shape Detection
Réalité virtuelle et réalité augmentée

TRAVAUX PRATIQUES :
 

L’évaluation des acquis se fait tout au long de la session au travers d’ateliers de mise en pratique des notions et concepts abordés pendant la formation.

La formation compte 30% de théorie et 70% pratique.

S'INSCRIRE À CETTE
FORMATION PROGRESSIVE WEB APP (PWA)
Cliquez sur une date pour vous inscrire
Information pratiques sur
LA FORMATION
Lieu de la formation Paris - LA DEFENSE
Nous contacter 01 43 34 90 94
CETTE FORMATION SUR-MESURE Ce cours est réalisable en intra-entreprise, dans vos locaux ou nos salles de cours CONTACTER NOTRE SERVICE INTRA
D'autres formations
SUR LE MÊME THÈME

1 j

 

Web - Digital

L'Accessibilité Web
La formation Accessibilité Web à été conçue pour vous donner les clés afin de vous permettre de construire des sites consultables  par ...

2 j

 
Cette formation pratique Accessibilité Web vous enseigne les bonnes pratiques de développement front-end et vous les fait mettre en œuvre afin d'assurer un site pleinement...

3 j

 
Une eXpérience Utilsateur (UX) est un domaine émergeant de la conception de logiciel centrée sur l'utilisateur qui priorise les interactions de l'utilisateur lors de...

3 j

 
L'UX Design (pour "User Experience", expérience utilisateur) fait référence au ressenti d'un utilisateur lors de l'utilisation d'une interface,...
Plus de formations sur le même thème

Des questions ?

ON VOUS RAPPELLE

 

0

Formations
Informatique
et Management
en ligne à ce jour

+ 0

Stagiaires dans nos
salles de cours sur
l'année

0%

De participants
satisfaits ou très
satisfaits de nos
formations

0

Formateurs experts
validés PLB