CAS D’ETUDE

Refonte Complète d'une Application en React

OBJECTIFS

L'objectif principal de notre mission : la refonte technologique globale et la fusion des sites et des services proposés aux formats web et mobile.

  • React.js
  • React Native
  • Next.JS
  • JEST
  • Lerna
  • Gitlab CICD
  • AWS
  • EC2
  • Terraform

MISSION

ESENS réalise pour le compte de son client, grand spécialiste du pari sportif, une mission de développement front end. Il s'agit de procéder à la refonte complète des technologies et de l'écosystème du projet tout en adaptant les besoins à venir sur les supports web et mobiles.

  • CONCEPTION

    Durant plus de trois mois, une longue analyse est faite dans le but de concevoir le produit parfait. Au travers d'ateliers réunissant le métier, les développeurs et l'agence de design, une première ébauche de maquette voit le jour. Une enquête utilisateur permet ensuite d'identifier les axes d'amélioration. Pendant ce temps, un POC technique est en cours de réalisation pour déterminer les technologies, compatibles à la fois avec le développement web et le développement mobile, qui seront utilisées pour le projet.

  • CONDUITE DE PROJET

    Lorsqu'une fonctionnalité est décidée, elle est réfléchie par le métier et les Products Owners (PO) pour être ensuite conçue graphiquement par une agence. Cette 'feature' est ensuite découpée en 'stories' par les PO et seront à leur tour chiffrées par l'équipe de dev puis redécoupées en sous tâches. Chaque story est développée (dev), revue (dev review), testée (testeurs), validée (PO) et 'merged' pour être enfin envoyée en production. L'équipe est encadrée par un responsable et les principes de la méthode agile Scrum sont appliqués. Chaque fonctionnalité peut-être ajustée à n'importe quel moment de ce workflow.

  • PRODUCTION

    L’application Web est développée en React.JS à l’aide de Next.JS pour gérer le routing et la partie Server Side Rendering (SSR). L'application mobile est développée en React Native. La production est également conduite selon l’approche 'Continuous Delivery' avec une automatisation complète du process de déploiement pour le front permettant une mise en production rapide et efficace. De plus, nos environnement de tests rendus dynamiques grâce à des scripts de Terraform et AWS sont très utiles pour les fonctionnalités en cours de développement testables et/ou validables.

  • TEST

    Avec pour but de couvrir au maximum notre code de manière unitaire, chaque méthode portant une certaine logique doit être testée afin de ne pas engendrer des problèmes de régression par la suite. Même si la phase de review et de test prévient ce problème, Jest agit comme un filtre important de bug potentiel. Les méthodes portants la logique doivent être séparées de celles qui affichent simplement du contenu afin d'assurer un découpage propre et d'éviter des duplications de code.

STRATEGIE

Dans ce contexte de refonte, l'équipe s'est attachée à ne pas reproduire les mêmes erreurs. La mutualisation du code et le design des applications web et mobile était donc nécessaires au bon déroulement du projet dans le but d'assurer la même expérience à tous les utilisateurs. De plus, il fallait répondre à une seconde problématique de taille : le référencement naturel (SEO). Chose faite grâce au Server Side Rendering (SSR) pour la partie web.

RETOUR

Actualité récente

VOIR TOUTE NOTRE ACTUALITE

Team Building | ESENS à Disneyland Paris !

Le 13 décembre dernier, une partie de la dream team se retrouvait à Disneyland Paris pour célébrer les fêtes tous ensemble lors d'une journée à sensations fortes !​ Venez (re)vivre la magie de notre Noël d'équipe en images !​​

Lire la suite