Conversion de la PWA en app mobile

[babastienne]

Ce ticket a pour objectif de lister les éléments permettant d'y voir plus clair sur les implications associées à la conversion de la PWA en apk / app mobile.

Il nous faudrait un rapport d'analyse sur les problématiques suivantes :

• Comment convertir GTR3 en apk ?
• Qu'est-ce qui est bloquant actuellement et pourquoi ?
• Que faudrait-il faire pour faire une conversion propre en apk ? Qu'est-ce que ça représente en terme de travail ?
• Est-ce qu'on sera en mesure de gérer les notifications locales sur le device ? Le hors ligne ?
• Y a t-il une distinction iOS / Android à prendre en compte ?
• Autre ...?

@camillemonchicourt n'hésite pas à compléter avec certaines interrogations supplémentaires si besoin.

[babastienne]

Ressources complémentaires :

Analyse effectuée en 2022

Afin de proposer une Application à Google Play ou Apple Store, il est possible de convertir la PWA en APP grâce à Capacitor https://capacitorjs.com/blog/mobile-apps-with-tailwind-css-nextjs-ionic-and-capacitor.

Pour cela, la première étape consiste à réaliser un export de la PWA ( = générer un dossier de fichiers HTML pouvant fonctionner seuls sans l'utilisation d'un serveur NodeJS). La base du framework de Geotrek Rando est NextJS et celui-ci permet de faire un export sous certaines conditions : https://nextjs.org/docs/advanced-features/static-html-export

Et dans la section "unsupported features" il y a ces 3 fonctionnalités largement utilisées dans notre application :

    Image Optimization (default loader)
    Internationalized Routing
    getServerSideProps

- Image Optimization (default loader) n'est pas très problématique et on pourrait se débrouiller pour l'adapter.
- getServerSideProps permet de récupérer toutes les informations nécessaires (appel API) pour la page courante et distribuer une page sans avoir besoin de JavaScript. NodeJS est nécessaire pour traiter les demandes.
- Internationalized Routing qui permet les traductions des pages.

Nous avons fait des recherches pour contourner ces freins :

    - SSR: une grande discussion est échangée ici https://github.com/vercel/next.js/discussions/15674.
    Il est expliqué que NextJS refuse de faire un export dès qu'il voit du SSR et l'utilisation de getServerSideProps. Mais avec getInitialProps qui gère aussi du SSR c'est ok pour export sauf que ce dernier est considéré comme anti performance et la docuentation de NextJS recommande de le purger du code si possible.
    Le plugin https://github.com/erzr/next-babel-conditional-ssg-ssr permet de lever le blocage de NextJS par rapport à getServerSideProps, cependant j'ai vu qu'il y avait déjà des problèmes de compatiblité avec la version 12 de NextJS et pas trop de réaction de la part du créateur du dépot.

    Une idée serait de transformer l'approche architecturale de l'application en passant de SSR+Cache (Server-Side Rendering) à SSG+ISR (Static Site Generation + Incremental Static Regeneration). Il est noté que l'ISR est également un frein pour la génération d'un export toutefois les contraintes sont moins compliquées à contourner.
    ⚠ NB: Il s'agit de changer vraiment toute l'architecture/philosophie de l'application, il ne s'agit pas là d'un développement trivial.

    - Internationalized : Le problème sous-jacent de l'internationalisation c'est que cela utilise également du SSR pour générer les traductions des pages avant rendu. J'ai regardé https://www.npmjs.com/package/next-export-i18n compatible avec un export NextJS.
    Et cela implique de changer complètement l'architecture i18n (i18n = internationalisation) pour appeler les méthodes de ce plugin au lieu de react-intl (le plugin utilisé actuellement).
    De plus on aura une régression au niveau de la PWA car next-export-i18n ne fera pas les traductions pour la partie SSR, uniquement en hydratation; ce qui est dramatique pour le SEO (référencement) et l'a11y (accessibilité).

Pour conclure, aujourd'hui selon moi, Geotrek Rando n'est pas encore adapté pour l'encapsuler dans une application.

Travail effectué par @Sylchauf en 2022

Code Github : https://github.com/Sylchauf/Geotrek-rando-pwa
APK du POC : https://cloud.ecrins-parcnational.fr/index.php/s/3H63Fjix2qjmFeJ

Commentaire associé :

Nous avions évoqué il y a plusieurs mois un essai que j'avais fait sur l'application pour encapsuler ta PWA dans une «coquille» React Native. 
Concrètement, cela permet d'être présent sur les stores sans développer une deuxième version en parallèle.

Ce Proof Of Concept a plusieurs limitations, qui peuvent être résolues en y passant plus de temps, à savoir : 
- Le démarrage à froid offline ne fonctionne pas (cad qu'on peut lancer l'application uniquement si on est connecté à internet. Si internet est perdu après le lancement, ce n'est plus un problème)
- la version iOS n'est pas cablée
- Il n'y a pas de bridge notifications natives / utilisateur connecté etc ...
- Il y a un système de cache assez agressif, une fois qu'une page est téléchargée sur le mobile il n'est plus jamais mis à jour

De mémoire j'avais quand même cablé le GPS, mais je ne suis pas sûr de l'avoir testé.

Toutes ces limitations sont essentiellement dues au temps passé dessus et pourraient être corrigées pour une version de production.
A noter que je n'ai pas creusé la partie «Une application pour tous [les Geotrek]» mais c'est également possible.
Évidemment, il y a quelques bugs présents, mais l'objectif de démontrer si c'est possible ou pas me semble convaincant.

[camillemonchicourt]

OK merci.
Voici des éléments sur le contexte et les objectifs identifiés par la communauté Geotrek sur le sujet :

• Le groupement de commande Geotrek de 2019-2021 a travaillé sur la refonte complète du portail Geotrek-rando en V3, avec notamment l'objectif d'améliorer et de faire converger l'expérience web et mobile de Geotrek-rando.
• Lors de cette refonte de Geotrek-rando, nous avons retenu la stratégie et l'orientation de concentrer nos efforts sur un portail web et rando, sous forme de PWA qui pourrait aussi faire office d'application mobile sur les stores dans un second temps.
  Cette stratégie est partagée ici : https://geotrek.ecrins-parcnational.fr/ressources/gt/08-refonte-geotrek-rando/2020-01-28-Strategie-priorisation-Geotrek-2020-2021.png
  Et surtout ici : https://geotrek.ecrins-parcnational.fr/ressources/gt/08-refonte-geotrek-rando/2020-01-28-Strategie-Geotrek-2020-2021.pdf
• Cette stratégie a été confirmée et confortée par la communauté lors des rencontres Geotrek 2021 en plénière (https://geotrek.ecrins-parcnational.fr/rencontres/2021/presentations/15-geotrek-mobile.pdf) et en atelier (https://geotrek.ecrins-parcnational.fr/rencontres/2021/ateliers/geotrek-atelier-mobile.pdf). Il a notamment été discuté l'avenir de Geotrek-mobile à ce moment-là avec différentes réserves sur le sujet, et plusieurs territoires souhaitant arrêter leur utilisation de Geotrek-mobile privilégier l'enrichissement de Geotrek-rando sur le volet mobile, en explorant la possibilité de publier un Geotrek-rando sur forme d'application mobile publiable sur les stores Android et Apple.
• Ce développement n'a jusqu'alors pas été réalisé et il reste des questions techniques sur sa faisabilité, mais cela reste la piste privilégiée par la communauté.
• Geotrek-mobile étant encore utilisé par certaines structures, cet outil n'a pas été abandonné, mais la communauté n'y consacre presque plus de moyens et il est fort probable que l'outil soit en fin de vie, si une autre solution s'appuyant sur Geotrek-rando était trouvée.
• L'enjeu est de mutualiser et de faire converger les outils et les ressources de maintenance et d'évolutions que nous y consacrons