Lien du site - README en Français - README en Anglais

Projet réalisé dans le cadre du programme de formation Développeur Front-end JavaScript React chez OpenClassrooms.

1.1 Objectif :

• Conversion d’une application de jQuery vers React pour une grande société financière.

1.2 Compétences évaluées :

• 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

• Mesurer les performances de l'application avant et après la conversion (voir : 5.1 performance )
• Un design plus moderne de l'application

• Convertir l'ensemble du projet HRNet en React
• Convertir l'un des quatre plugins jQuery de l'application en React, et le publier sur npm ou Github packages (voir : 5.2 composant convertie )
• Un système de gestion d'état(Utilisation Redux)

• Git
• Node pour les commandes npm ou Yarn pour les commandes yarn

• React: ^18.2.0
• React-router-dom: ^6.22.3
• npm i react-router-dom ou yarn add react-router-dom
• react-redux: ^9.1.0
• npm i react-redux ou yarn add react-redux
• @reduxjs/toolkit: ^2.2.3
• npm i @reduxjs/toolkit ou yarn add @reduxjs/toolkit
• prop-types: ^15.8.1
• npm i prop-types ou yarn add prop-types
• react-datapicker: ^6.6.0
• npm i react-datapicker ou yarn add react-datapicker
• react-icons: ^5.0.1
• npm i react-icons ou yarn add react-icons
• uuid: ^9.0.1
• npm i uuid ou yarn add uuid

Cloner le dépôt :

git clone https://github.com/MeTuseL/HRnet

• Accéder au dossier "frontend-hrnet"

• Installer toutes les dépendances :

  npm install ou yarn

• Lancer le front-end :

npm run start ou yarn run start

Le front-end sera accessible sur le port 3003 : http://localhost:3003/HRnet.

• Lien vers les performances

• Composant Dropdown convertie publié npm
• Composant Dropdown convertie publié github

Website Link - README in French - README in English

Project carried out as part of the JavaScript React Front-end Developer training program at OpenClassrooms.

1.1 Objective:

• Conversion of an application from jQuery to React for a large financial company.

1.2 Assessed Skills:

• Analyze the performance of a web application
• Deploy a front-end application
• Refactor an application to reduce technical debt
• Set up a Front-End environment
• Produce technical documentation for an application

• Measure the performance of the application before and after conversion (see: 5.1 performance )
• A more modern design for the application

• Convert the entire HRNet project to React
• Convert one of the four jQuery plugins of the application to React, and publish it on npm or Github packages (see: 5.2 converted component )
• State management system (Using Redux)

• Git
• Node for npm commands or Yarn for yarn commands

• React: ^18.2.0
• React-router-dom: ^6.22.3
• npm i react-router-dom or yarn add react-router-dom
• react-redux: ^9.1.0
• npm i react-redux or yarn add react-redux
• @reduxjs/toolkit: ^2.2.3
• npm i @reduxjs/toolkit or yarn add @reduxjs/toolkit
• prop-types: ^15.8.1
• npm i prop-types or yarn add prop-types
• react-datapicker: ^6.6.0
• npm i react-datapicker or yarn add react-datapicker
• react-icons: ^5.0.1
• npm i react-icons or yarn add react-icons
• uuid: ^9.0.1
• npm i uuid or yarn add uuid

Clone the repository:

git clone https://github.com/MeTuseL/HRnet

• Access the "frontend-hrnet" folder

• Install all dependencies:

  npm install or yarn

• Launch the front-end:

npm run start or yarn run start

The front-end will be accessible on port 3003: http://localhost:3003/HRnet.

• Link to performance

• Converted Dropdown Component published on npm
• Converted Dropdown Component published on github