The HRnet project is an fictional internal web application that manages employees' data. It is a frontend project for the OpenClassrooms training program, cloned from OpenClassrooms-Student-Center/P12_Front-end. The repository contains all the source code for the frontend part.
The goal of this project was to upgrade the outdated app by converting it into a documented modular React app with functional programming and updated state management (originally using local storage). It was asked to rewrite jQuery plugins as React components, including a modal into a customizable package. Performance was also a key focus, with Lighthouse Performance tests being conducted.
The updated version of the project uses now a Github package for the modal component (<Modal />
) included in an external React library available at:
https://github.com/SyMelin/MelinSylvie_14_react_component_library.git
- React: For building the user interface.
- Redux: For state management.
- PropTypes: For component type-checking.
- CSS3: For styling and responsive design.
- Vite: This project was initially set up with Create React App but has since been migrated to Vite.
HRnet uses the following tech stack:
- Node.js v20.12.0 Ensure Node.js is installed. Check with
node --version
. - Npm: For dependency management
https://github.com/SyMelin/MelinSylvie_14_08083022.git
cd hrnet-app
npm install
npm run start
The app is locally available on port 3000
, go to http://localhost:3000.
The version of this project that is hosted on GitHub Pages is available on the gh-pages
branch. While the codebase remains largely unchanged, there is a notable modification in the vite.config.js
file and the Router component. Specifically, the current repository has been added as a base in the vite.config.js
file and as a basename prop in the Router. This adjustment is a workaround to address an issue with GitHub's handling of routing.
This project is licensed under the MIT License. See the LICENSE file for more information.