Vous travaillez pour le département technologique de Wealth Health, une grande société financière.
Cette société utilise une application web interne appelée HRnet, qui gère les dossiers des employés. L'application est ancienne et utilise jQuery côté front end, ce qui entraîne des bugs considérables et une augmentation des plaintes en interne.
Voici la liste des plugins jQuery actuellement utilisés qui doivent être convertis / remplacés :
- Plugin de sélection de date
- Plugin de fenêtre modale
- Menus déroulants
- Plugin pour les tables de données
Le dépôt Github de HRnet jQuery est accessible via l'url suivante :
https://github.com/OpenClassrooms-Student-Center/P12_Front-end
Votre équipe de développement a décidé de lancer une refonte de l'application et on vous a confié les différentes tâches suivantes :
- Convertir l'ensemble du projet HRNet en React
- Convertir l'un des quatre plugins jQuery actuels en un composant React
- Remplacer les 3 plugins jQuery restants par des composants React issus de libraires existantes
- Effectuer des tests de performance Lighthouse en comparant l'ancienne et la nouvelle application
Le package npm vz-react-modal a été développé dans le cadre de cette refonte afin de convertir le plugin jQuery de fenêtre modale en un composant React.
- Analyser la performance d'une application web
- Déployer une application front-end
- Refondre une application pour réduire la dette technique
- Mettre en place son environnement Front-End
- Produire de la documentation technique pour une application
Cloner le repository via :
git clone https://github.com/vzamboulingame/openclassrooms-projet-14.git
Lancer HRnet React comme suit :
cd openclassrooms-projet-14
pnpm install
pnpm run dev
Le site sera alors accessible en local via l'URL :
http://localhost:5173
On peut lancer les tests avec Vitest UI comme suit :
cd openclassrooms-projet-14
pnpm run test:ui
L'interface web de Vitest UI s'ouvrira automatiquement en lançant les tests sur l'URL suivante :
http://localhost:51204/__vitest__/#/
Vinodh Zamboulingame
