Concevoir un écosystème web pour un service de mobilité solidaire
Crédit : Rezopouce
Rezo Pouce
Rezo Pouce est un service d’autostop organisé, porté par la SCIC (Société Coopérative d’Intérêt Collectif) Mobicoop, engagée dans la mobilité solidaire et durable. Le principe : des points d’arrêt identifiés sur le territoire, une inscription vérifiée, une assurance dédiée — et la possibilité pour des automobilistes et des passagers de partager des trajets de manière flexible, principalement en zones rurales et péri-urbaines.
Le service s’adresse à des publics très différents : des usagers qui souhaitent faire du stop au quotidien, des séniors en demande de mobilité accompagnée, des conducteurs bénévoles, et des référents de territoire qui animent le réseau localement. À ces publics correspondent des besoins d’interface très distincts, et c’est précisément ce qui rend le projet intéressant d’un point de vue technique.
En parallèle du service d’autostop, Rezo Pouce porte Rezo Séniors : un dispositif de transport solidaire dédié aux personnes âgées, qui met en relation des passagers séniors avec des conducteurs bénévoles pour des trajets du quotidien.
L’existant et la reprise
Quand j’ai pris en charge le projet, l’existant reposait sur un site Joomla couplé à une application Symfony 1.x. La dette technique était importante, les deux systèmes coexistaient difficilement, et toute évolution fonctionnelle était devenue coûteuse. La décision a été prise de repartir de zéro.
Une API centrale et ses applications
L’enjeu principal était de construire un système capable de servir plusieurs interfaces aux besoins très différents, sans dupliquer la logique métier. La réponse architecturale a été de concevoir une API REST Symfony centralisée qui concentre l’ensemble des règles métier et expose des endpoints consommés par toutes les applications.
Cette API est le seul point d’accès à la base de données. Aucune application front ne communique directement avec la couche de persistance. Elle gère notamment la logique de mise en relation passagers/conducteurs, l’envoi d’emails transactionnels et de SMS, la génération de documents PDF, la gestion des utilisateurs et des territoires, le géocodage et le calcul d’itinéraires.
Autour de cette API gravitent plusieurs applications, chacune adressant un public et un usage spécifique :
- rezopouce.fr est le site public, développé avec Symfony et AngularJS. Il embarque les pages institutionnelles, la cartographie interactive des points d’arrêt, le parcours d’inscription au service Rezo Séniors, et une SPA dédiée à la gestion des trajets séniors.
- inscription.rezopouce.fr est l’application d’onboarding des utilisateurs, développée en Angular. Elle guide les nouveaux inscrits à travers un processus d’adhésion structuré.
- administration.rezopouce.fr est le back-office destiné aux référents de territoire, également en Angular. Il leur permet de gérer les utilisateurs de leur zone, de suivre les demandes de trajets, et d’administrer le réseau local.
L’ensemble est hébergé sur un VPS chez OVH, conteneurisé aujourd’hui avec Docker pour faciliter les développements, et les applications communiquent via un réseau Docker partagé.
Les API Rezo Pouce et Mobicoop échangent également des données entre elles, notamment autour des points d’arrêt.
Le site public : rezopouce.fr
C’est à cette application que cette série d’articles est consacrée. Le site public est la vitrine du service et le point d’entrée pour les utilisateurs finaux. Il couvre des besoins variés : informer sur le service, présenter les territoires et leurs communes, permettre l’inscription et la connexion des utilisateurs, et offrir un espace applicatif complet pour le service Rezo Séniors. Il est complété par une application mobile (disponible pour Android et iOS) à laquelle j’ai contribué.
L’application est organisée en bundles Symfony, chacun responsable d’un domaine fonctionnel : le bundle principal pour les pages publiques et la cartographie, un bundle utilisateur pour l’authentification et l’inscription, un bundle dédié aux cartes embarquables en iframe, un bundle média pour la gestion des photos, et un bundle pour les tâches planifiées. L’interface repose sur Bootstrap 4 et le moteur de templates Twig.
Territoires, communes et cartographie
Le socle géographique structure l’ensemble du site. Chaque territoire regroupe des communes, et chaque commune dispose de points d’arrêt pour l’autostop et de points relais pour l’inscription physique. Les pages de territoire et de commune affichent des cartes interactives Leaflet avec les marqueurs des points d’arrêt, et proposent des fiches mobilité, des informations transport, et les coordonnées des référents locaux.
Un système de statuts gère le cycle de vie des territoires : actif, désabonné, ou maintenu temporairement le temps du retrait des panneaux physiques. Selon le statut, l’accès aux pages est autorisé, restreint ou accompagné d’un avertissement.
Les cartes sont également disponibles en iframe pour être intégrées sur des sites tiers — un besoin fréquent pour les collectivités partenaires.
Un champ de recherche par autocomplétion est également disponible. Au clic sur le nom de la commune recherchée, si elle est abonnée au service, sa page est affichée. Dans le cas contraire une boite de dialogue est affichée expliquant à l’utilisateur la situation de la commune concernée.
Authentification et inscription
Le système d’authentification fonctionne en double : un utilisateur local Symfony, géré par FOSUserBundle, est synchronisé avec un utilisateur distant sur l’API. À chaque connexion, un token API est obtenu et stocké localement pour les appels ultérieurs. La réinitialisation de mot de passe suit le même principe de synchronisation bidirectionnelle.
L’inscription au service Rezo Séniors passe par un formulaire AngularJS en quatre étapes — identification, profil, coordonnées avec vérification d’éligibilité territoriale, et validation avec pièces justificatives. Un système d’utilisateur temporaire côté API permet de ne convertir le compte en utilisateur définitif qu’après confirmation par email.
Rezo Séniors
Le service de transport solidaire dispose de sa propre SPA AngularJS, intégrée dans le site Symfony. Côté passager, un sénior peut créer une demande de trajet avec départ, destination et créneau souhaité. L’API identifie alors les conducteurs compatibles et les notifie automatiquement. Côté conducteur, l’interface permet de consulter les demandes en cours, d’accepter un trajet, et de gérer ses disponibilités et communes desservies. Un système de notifications par email et SMS accompagne chaque étape du processus.
Contenu et médias
Le site gère des pages dynamiques identifiées par leur slug et récupérées depuis l’API, ainsi que des pages statiques pour les contenus institutionnels (FAQ, CGU, bonnes pratiques). Un bundle média prend en charge l’upload, le redimensionnement et le recadrage des photos de profil.
Une stack qui a vieilli
Au moment de sa conception, ces choix étaient cohérents et parfaitement adaptés aux besoins du projet. Mais aujourd’hui, une reprise complète serait nécessaire pour continuer à faire évoluer la plateforme sereinement — avec une migration Symfony, un remplacement d’AngularJS par un framework moderne, et une mise à jour de l’ensemble de la chaîne.
Ce constat ne diminue pas la valeur du travail accompli. Au contraire, maintenir un écosystème technique cohérent sur plusieurs années, avec des technologies qui évoluent plus vite que les budgets de refonte, est une réalité courante en contexte professionnel — et un exercice formateur.
Cinq ans de développement en autonomie
Ce projet a été conçu, développé et maintenu sur environ cinq ans, en tant que développeur full stack principal, avec l’appui ponctuel de trois stagiaires sur des sujets ciblés.
C’est une configuration assez rare : avoir la responsabilité complète d’un écosystème, des choix d’architecture initiaux jusqu’à la maintenance en production, en passant par chaque ligne de code front et back. Cela implique une vision transversale permanente — comprendre comment une décision prise côté API impacte les trois applications qui la consomment, anticiper les évolutions métier, et maintenir la cohérence d’ensemble sur la durée.
La suite
Cet article pose le cadre. Les suivants entreront dans le détail de chaque domaine fonctionnel du site public :
- Territoires et cartographie — le modèle géographique à trois niveaux, les cartes Leaflet, les cartes embarquables en iframe, et la gestion des statuts de territoire
- Authentification et inscription — le système dual Symfony/API, le parcours d’inscription en quatre étapes, et le mécanisme d’utilisateur temporaire
- Rezo Séniors — la SPA AngularJS embarquée, les flux passager et conducteur, le système de notifications
Une question ou un projet ?
Je suis disponible pour en discuter.