Ma mission chez Korian (désormais nommé Clariane) était très étendue: j'ai apporté mon expertise dans le développement web fullstack et ma grandissante compétence en architecture logiciel, mais j'ai également beaucoup appris en DevOps et en gestion de projet. En effet, cette mission était composée d'une kyrielle de sous-projets, chacun rattaché à un besoin métier spécifique. J'ai donc dû m'adapter à des contextes très différents, et j'ai participé à l'uniformisation des projets entre eux.
Refonte générateur de landing pages
Landing page: une page internet qui propose un contenu orienté spécifiquement sur la présentation d'une offre, d'un produit ou d'un service bien précis. L'objectif d'une landing page est d'inciter le visiteur à s'impliquer au moyen de ce qu'on appelle un "call-to-action" (il peut s'agir d'un lien, un formulaire ou encore simplement un bouton).
Il existe chez Korian des dizaines de landing pages, chacune destinée à promouvoir un établissement spécifique (généralement un EHPAD). Toutes ces pages internet sont regroupées dans un unique projet en interne qui s'occupe de rediriger l'utilisateur vers la page bonne page lorsque celui-ci cherche à y accéder.
Exemple de landing page en ligne, avec formulaire de contact pour prospection
Ce « générateur de landing pages » était lent, peu fiable et difficile à maintenir. J'ai travaillé un mois dessus avant de pousser à la direction la volonté de le refondre intégralement avec des technologies modernes, des outils plus robustes (Typescript, NextJS) et une architecture plus solide. On m'a fait confiance sur ce projet, j'ai travaillé dur pour leur proposer une solution qui leur fera gagner du temps, autant en développement qu'en maintenance.
J'étais très fier de cette refonte et le résultat ne s'est pas fait attendre: l'amélioration des performances ont grandement satisfait la direction, ils ont gagné en qualité SEO et en conversions puisque leurs sites étaient plus adaptés à leurs cas d'utilisation.
Création de nouvelles landing pages
En parallèle de la refonte, le métier exprimait le besoin de créer de nouvelles landing pages pour de nouveaux établissements ou bien pour ceux qui n'en étaient pas encore dotés. Les maquettes étaient fournies, il s'agissait là simplement d'un travail d'intégration web, entièrement dans mes cordes. J'en ai profité pour améliorer le CSS général, puisque les anciennes pages n'avait pas été réalisées par un expert - apparaissaient donc des problèmes de responsive mais aussi et surtout de maintenance.
Une landing page que j'ai créée, servie par l'application dont je parle plus haut
Création d'une nouvelle application "Korall"
Fort de ces premiers succès, j'ai été promu lead frontend sur un nouveau projet: la création d'une application interne pour les employés de Korian. Cette application devait permettre aux gérants des différents sites d'accéder rapidement aux ressources des clients. J'ai travaillé en étroite collaboration avec les équipes métiers pour comprendre leurs besoins et leurs contraintes, et j'ai pu leur proposer une solution qui leur a permis de gagner en efficacité et en sérénité.
J'ai pris en main toute l'architecture de ce projet fullstack:
- Architecture hexagonale
- Connexions SSO Azure
- Connexions credentials classique
- Base de donnée et caching Redis
- Front et back Next.js
- Déploiement Docker et Kubernetes
Page principale de Korall
J'ai fait de mon mieux pour apporter une solution solide au travers du choix des technologies et de l'architecture générale de l'application. Le choix de l'hexagonale est évident pour moi car le programme intéragit avec une multitude de services externes (BDD, services Microsoft, Oscar...) et cela facilite la mise en place de tests unitaires.
Bouton de connexion de Korall
Au final, mon client était ravi et nous avons pu rapidement mettre en production. Grâce aux choix pragmatiques et adaptés au contexte, la maintenance et les mises à jour sont simples - irais-je jusqu'à dire agréables ?
Page dynamique de l'application
Refonte d'une librairie de composants interne
Le chef de projet m'a ensuite confié la refonte de la librairie de composants interne « Backoffice package ». Cette librairie fournit un ensemble de composants utilisés par d'autres applications internes de Korian, par exemple:
- une liste avec système de recherche et filtre poussés
- un système de login comprenant entre autres un processus SSO
- des composants UX tels qu'un layout latéral, des titres, des cards et des animations créés avec Material UI
Page de démonstration des fonctionnalités de la librairie
Cette librairie était surannée, caduque et impossible à maintenir: il n'y avait aucune architecture, aucune cohérence ni robustesse. J'ai donc chiffré avec mon chef de projet une refonte complète de cette librairie pour lui offrir une plus grande durée de vie, et faciliter sa maintenance. Cette refonte comprenait:
- la mise à jour de MUI 4 vers 5
- le passage à Typescript
- passage de React 14 à 18 (et donc réécritures des composants classe en fonctionnels)
- suppression de Redux au profit de la ContextAPI standard
- création d'une application de test pour montrer les fonctionnalités du projet
- mise en place architecture hexagonale
- réécriture de la CI/CD
Démonstration d'un composant de cette librairie dans l'application de démo
Cette refonte a nécessité la mise à jour de toutes les applications qui en dépendaient: ces mises à jour ont consisté en la quasi totalité des étapes nécessaires à la refonte de la librairie. Je peux vous assurer qu'il s'agissait d'un travail titanesque pour un développeur seul. Toutefois j'aime ce genre de défi, et une fois que j'ai les mains dans le cambouis on ne m'arrête plus.
Démonstration d'un autre composant de cette librairie, une liste avec filtres et recherche
Reprise projet Anap
La reprise d'un projet fullstack nommé « Anap » nous a échu à mon équipe et moi. Ce projet était en phase de développement depuis quelques mois, mais il était mal parti car développé par un stagiaire inexpérimenté. Nous avons donc dû reprendre le projet et le faire fonctionner pour ensuite l'envoyer en production. Je n'ai pas pu mettre en place l'architecture de mon choix car le budget client était serré et donc nous avons dû faire avec les technologies déjà en place.
Il s'agissait principalement de:
- connecter le projet en SAMLv2 à Azure
- corrections problèmes CSS et Javascript variés
- faire fonctionner les endpoints (notamment via mise en place BDD)
- mise en place CI/CD
- déploiement Kubernetes
Petite anecdote: une fois en production, ce projet a été abandonné 🤷🏼♂️ cela m'apprendra que dans le domaine informatique, on peut mettre beaucoup de budget dans un projet pour au final l'abandonner. Je ne suis toutefois pas mécontent d'avoir travaillé sur Anap puisque j'en ai tiré des leçons et des compétences.
TMA Store locator
Un plus petit projet chez Korian se nomme « Store Locator »: il s'agit d'une application destinée au sous-traitant qui reçoit les appels des prospects pour les conseiller efficacement. Cette application affiche une carte de la France sur laquelle sont répartis les différents établissements du troisième âge, chacun avec une petite description et des informations utiles comme l'adresse, le type d'EHPAD ou encore un numéro de téléphone.
Durant cette période, je ne croulais pas sous le travail et donc j'ai travaillé de mon côté à une refonte partielle de l'application pour:
- mettre à jour React vers la version 18
- migrer les composants classe vers des composants fonctionnels
- passer à une architecture hexagonale
- corriger le responsive
- améliorer les performances générales, par exemple en parallélisant les appels API
Page principale du Store Locator avec la fameuse carte de la France
La maintenance était simple mais satisfaisante, et j'ai rendu un projet en meilleur état que je ne l'ai trouvé.
Conclusion
Note à moi-même: je ne jure en ce moment que par l'architecture hexagonale, qui pour moi offre de vrais bénéfices mais qui me limite probablement quant aux autres types d'architecture qui existent. Pour mes futurs projets, je tenterai d'autres approches avec notamment des architectures plus simples, ou à défaut plus adaptées selon le cas d'utilisation (quoique l'architecture hexagonale est fort adaptée à la majorité des projets à mon sens). Le mot d'ordre: ne jamais cesser d'apprendre !