Progressive Web Apps (PWA)

• 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

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 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
• Le Service Worker en détail
• Rappels sur quelques API de base : promesses, 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 integrant de base les Service Workers et Manifest
• Outils de développement et débogage : devtools des navigateurs, lighthouse

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 de LocalStorage, mais IndexedDB
• Une SPA ultra rapide avec l'architecture
• Application Shell

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

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

Une attestation de participation sera transmise aux participants