SportSee

OpenClassrooms project context :
As a front-end developer at SportSee, I was tasked with developing a new version of the user profile pages for a sports coaching application. The goal was to allow users to view their personal statistics, such as completed sessions or calories burned, through a modern interface focused on data visualization.

The project required building a complete React interface based on Figma mockups and an existing Node.js backend. Several challenges had to be handled at the same time: page navigation, authentication, user data retrieval, data normalization before display, and the integration of readable and performant charts. Another key requirement was to isolate HTTP calls outside of the components in order to maintain a clean architecture.

I developed the profile pages in React by structuring the application around a clear and maintainable logic.

More specifically, I:

• implemented navigation with React Router;
• integrated an authentication flow connected to the backend;
• used the Context API to manage global state;
• created a mock data system to start development without immediately depending on the API;
• centralized HTTP calls into dedicated hooks, separated from the components;
• standardized and formatted API data before displaying it;
• integrated multiple charts using Recharts to represent sports activity;
• ensured a desktop implementation faithful to the mockups, readable from 1024 × 768 px and above;
• used Postman to test backend endpoints locally.

The application allows users to clearly visualize their main sports metrics through a modern, structured, and component-based interface. This project helped me strengthen my skills in React, front-end architecture, global state management, and API consumption in a context close to a real product application.