Exemple concret de Progressive Web app : la PWA Novaway

La progressive web app est une technologie qui permet de créer un site ou une application mobile doté(e) de fonctionnalités d’applications natives. Chez Novaway, nous sommes convaincus que les PWA sont une solution d’avenir dans le domaine de la création d’applications. Elles favorisent un développement de projets mobiles efficace, plus rapide et moins coûteux.

Nous remarquons néanmoins que cette alternative reste peu connue des personnes désirant développer une application. Nous avons donc décidé de créer notre propre showcase PWA, consultable par tous, afin de vous présenter les possibilités qu’offre cette technologie.

Installer la PWA sur un autre navigateur

Que pourrez-vous tester dans cette démonstration PWA ?

Ce showcase vous permettra de comprendre et de tester certaines des fonctionnalités principales qu’il est possible d’intégrer à une PWA, parmi lesquelles :

  • L’envoi de notifications push
  • L’accès aux contenus en mode hors-ligne
  • L’optimisation de l’espace disque grâce à un stockage de données limité
  • L’accès à des fonctionnalités du téléphone, avec le cas des contacts
  • L’accès au système de géolocalisation
  • Le scan de codes-barres et vos QR code
Qu’est-ce qu’une progressive web app ?

Comment installer notre progressive web app ?

L’installation est une étape obligatoire pour toute application mobile ou desktop. ll existe plusieurs manières d’installer une PWA. Veuillez suivre les indications correspondant à votre système d’exploitation / navigateur :

Les différentes manières d’installer une PWA sur Android.

Sur Google Chrome

  • A. En passant par le bandeau Add to home screen du navigateur. Celui-ci s’affiche automatiquement lorsque l’utilisateur visite un site web qui propose une PWA.
  • B. En cliquant sur un bouton pensé à cet effet qui permet de lancer l’installation : une manière plus UX générée côté développeur via l'événement beforeinstallprompt.

Sur Mozilla Firefox

L’installation est actuellement manuelle pour l’utilisateur. Une icône maison, en haut à droite de votre navigateur, apparaît si le site propose l’installation d’une PWA.

Depuis le Google Play Store

Si la PWA a été publiée sur le Google Play Store, il suffit de l'installer comme n'importe quelle autre application du store.

Installer une PWA sur iPhone ou iPad

Il existe une seule et unique méthode pour installer une PWA sur iOS. Le processus est similaire à celui de Firefox sur Android : une installation manuelle depuis le navigateur Safari.

En effet, l’installation depuis Chrome et Mozilla depuis un environnement iOS n’est actuellement pas rendue possible par Apple.

Installer une PWA sur le navigateur de votre ordinateur

Les navigateurs récents proposent une installation “prompt” : une notification apparaît afin de demander si vous souhaitez ou non installer le site web en mode PWA.

Une installation manuelle est également possible :

Sur Google Chrome

Une icône représentant un écran et une flèche est affichée tout à droite dans la barre d’URL.

Sur Edge

Une icône représentant un + dans un cercle est affichée tout à droite dans la barre d’URL.

Nos articles sur le thème de la PWA