Présenté par chaima limayem

Une progressive web app (PWA)

c’est quoi ?

Une application Web progressive (PWA) est un site web qui utilise les capacités
modernes des mobiles (Notifications push, GPS, Appareil photo…)
But : offrir aux utilisateurs une expérience semblable à celle d’une application mobile
native.
Contrairement à une app, tout le contenu est accessible via une URL et indexé par
les moteurs de recherche.

Pourquoi utiliser une PWA ?

1. Une seule application PWA

Grâce à cette technologie, une seule et même application est développée pour

fonctionner sur tous les plateformes web, IOS, Android.

2. Le référencement de la PWA

Comme un site web classique, l’application peut être référencée sur les moteurs de

recherche via son SEO.

3. La PWA est disponible hors-ligne

- Certaines des données de l’application peuvent être conservées en cache grâce à

des scripts nommés Service Workers qui feront les liens ou non avec les API.

- Ainsi, il est possible d’avoir accès à l’application sans être connecté à Internet, après

une première utilisation avec Internet, évidemment.

- Les données seront automatiquement mises à jour lors de la reconnexion.

4. La PWA est installable sur son mobile

- Une PWA est simple d’accès, puisqu’elle s’installe directement sur l’écran d’accueil

de l’appareil.

5. La PWA est modulable

- Une des forces des PWA par rapport à une application web est de pouvoir accéder

aux fonctionnalités du smartphone tel que les notifications, l’appareil photo, le

Bluetooth, etc.

- Il est également possible de consulter d’un coup d’oeil ce que votre navigateur est

capable de gérer comme fonctionnalité du téléphone.

Les principes de développement d’une PWA ?

Il y a 3 étapes à respecter pour mettre en place une PWA sur votre
site internet, que voici :

1. Le manifeste :

Un fichier manifeste est un petit fichier, au format JSON, décrivant toutes les

métadonnées de la web app.

-Par exemple, il contient le nom, la langue, l’icône utilisée sur l’écran d’accueil, etc…

2. Le HTTPS :

Les Progressive Web App utilise ce qu’on appelle des Service Workers. Or ces
derniers ne fonctionnent qu’avec une connexion sécurisée.
3. La mise en place d’un Service Worker

Qu’est-ce qu’un service worker ?

- Il s’agit d’un script JavaScript, chargé parallèlement au code de la page de votre site

internet dans votre navigateur et qui fonctionne en arrière plan.

-Il se comporte un peu comme un serveur proxy, c’est-à-dire qu’il va servir

d’intermédiaire entre le navigateur et internet.

-Il va donc pouvoir, par exemple, stocker les données d’une page web en cache et la

mettre à jour lorsque vous naviguez sur le site.

→ possibilité d’ouvrir notre site de façon rapide et même sans connexion internet.

Conclusion
Pour faire simple, une PWA est une version ultra optimisée pour mobile d’un site web,

qui est capable d’utiliser certaines fonctionnalités de l’appareil.

-Le terme progressif vient du fait que l’application est chargée au fur et à mesure de la

navigation et non tout d’un coup.