VCM
Une application web basée sur les rôles qui réunit tout ce dont une communauté résidentielle a besoin au sein d'une seule interface : propriétaires, résidents, finances, réservations, demandes et rapports.
React 19
React Router 7
Vite
TypeScript
SCSS
Jotai
SWR
Firebase Cloud Messaging
Aperçu
VCM est le front-end d'une plateforme de gestion immobilière et de communauté qui répond aux besoins de deux publics très différents à partir du même code source. Les administrateurs l'utilisent pour gérer les opérations : biens, résidents, finances, incidents, rapports et communication. Les propriétaires et les résidents s'en servent pour gérer leurs propres démarches, notamment les paiements, les demandes d'intervention, les réservations d'espaces communs, les documents et les informations communautaires. Le produit rassemble un ensemble de processus manuels et dispersés au sein d'un espace unique et cohérent.
Le Problème
Gérer une communauté résidentielle implique d'orchestrer de nombreuses opérations simultanées : dossiers des résidents et propriétaires, demandes d'entretien et d'intervention, réservations d'espaces communs, réclamations, historique des paiements, relevés, rapports d'inspection et d'incidents, ainsi que les annonces. Lorsque ces données sont éparpillées entre feuilles de calcul, fils d'e-mails et outils disparates, des informations se perdent. L'enjeu consistait à concevoir une interface unique répondant à la fois aux besoins d'une équipe d'exploitation et à ceux des résidents qu'elle accompagne — deux expériences réellement distinctes —, tout en conservant une solution rapide, homogène et maintenable au fil des nouveaux flux de travail ajoutés.
Mon Rôle et Mon Approche
J'ai dirigé le développement front-end : l'architecture de l'application, la couche de données partagée, les modèles d'interface utilisateur réutilisables et la structure basée sur les rôles qui soutient l'ensemble. En tant que contributeur principal sur le code source, j'ai instauré les conventions appliquées à l'ensemble du projet. Ma priorité était d'éviter le travers habituel de ces applications, qui consiste à réécrire la logique des tableaux, des filtres et des formulaires pour chaque nouvelle entité. J'ai préféré concevoir un ensemble restreint de primitives solides et un cadre qui intègre la gestion des permissions, faisant de l'ajout d'un nouveau flux de travail une simple composition plutôt qu'une réinvention.
Stack Technique
Fonctionnalités Clés
Galerie
Défis et Solutions
Le défi majeur résidait dans l'étendue du périmètre : des dizaines de types d'entités, nécessitant chacun consultation, filtrage, création, édition et exportation, pour deux profils d'utilisateurs distincts. Réécrire cette logique pour chaque fonctionnalité aurait produit une application impossible à maintenir. J'ai résolu ce problème grâce à des primitives réutilisables et un modèle de navigation configurable piloté par les autorisations, permettant à l'interface de s'adapter aux droits accordés par le backend sans coder les menus en dur ni dupliquer de logique.
L'autre exigence récurrente concernait un état capable de résister aux conditions réelles d'utilisation. J'ai géré la pagination et le filtrage des listes via les paramètres d'URL (query string), ce qui permet de partager les vues, d'assurer le bon fonctionnement des boutons précédent/suivant du navigateur et de préserver l'état des tableaux lors des rechargements. J'ai centralisé l'authentification dans un état partagé et au sein de la couche de requêtes pour garder des composants légers, tout en ajoutant un error boundary, des états de chargement et une redirection fluide à l'expiration de session afin qu'un tableau de bord dense n'échoue jamais silencieusement.
Résultat
VCM est un front-end unique qui répond parfaitement aux besoins des deux composantes de la gestion de communauté. Les équipes opérationnelles pilotent l'ensemble du cycle de vie des biens depuis un espace d'administration, tandis que les résidents gèrent leurs démarches en autonomie pour les paiements, requêtes, réservations et documents. Conçu sur des primitives partagées et une structure intégrant la gestion des permissions, le code source continue d'évoluer à mesure que de nouveaux flux de travail sont ajoutés, sans s'alourdir à chaque étape.
Vous avez un problème de produit similaire ?
Partagez le produit actuel, le résultat dont vous avez besoin et les contraintes qui font déjà obstacle. J'utiliserai cela pour définir un premier jalon raisonnable.
Services de développement SaaS