Le contexte du projet
Je cherchais un projet concret pour me lancer dans React et TypeScript. Plutôt que de développer une énième application de tâches, j'ai échangé avec un ami coach sportif spécialisé en haltérophilie, et l'idée de LiftBoard est née.
L'objectif : lui créer un outil simple pour préparer ses entraînements, calculer automatiquement les charges selon les records personnels et garder une trace des séances réalisées.
Au fil du développement, le projet a pris de l'ampleur. Ce qui était initialement un exercice pour monter en compétences est devenu une application fonctionnelle, avec de vrais enjeux de conception, de gestion des données et d'ergonomie.
Mon rôle dans la création
J'ai pris en charge la conception et le développement de LiftBoard, de la définition des fonctionnalités à la mise en ligne. L'objectif était de construire une application fonctionnelle, avec une navigation claire et une logique métier adaptée aux besoins des sportifs.
Le développement repose sur React et TypeScript, avec une interface organisée en composants réutilisables. J'ai notamment travaillé sur la gestion des états, les interactions entre composants et la persistance des données, en accordant une attention particulière à la fiabilité du fonctionnement.
Une interface pensée pour
l'entraînement
Pour LiftBoard, je n'ai pas cherché à multiplier les effets visuels. Je voulais avant tout une interface simple à comprendre, dans laquelle on retrouve immédiatement ses exercices, ses charges et ses résultats.
J'ai donc opté pour une direction graphique sobre, avec un thème sombre et du jaune pour faire ressortir les actions importantes. L'enjeu était aussi de rendre l'application agréable sur mobile, puisqu'un carnet d'entraînement doit pouvoir être consulté facilement pendant une séance.
La logique métier au cœur
de LiftBoard
C'est probablement la partie la plus intéressante du projet : transformer des données et des calculs en fonctionnalités réellement utiles. À partir d'un record personnel, LiftBoard calcule les charges adaptées à chaque exercice et à chaque intensité, tout en permettant de personnaliser ses séances.
J'ai également voulu aller au-delà de la simple programmation. Comme dans lors d'une séance, l'utilisateur peut renseigner ce qu'il a réellement soulevé, suivre ses séries et noter ses sensations avant, pendant ou après l'effort.
Le but est de conserver une trace complète de chaque entraînement, que la séance soit satisfaisante ou non, et pas seulement une liste de chiffres comme sur une note dans le coin de notre téléphone.
Gestion des données et fiabilité
Je voulais que LiftBoard reste simple à utiliser, sans imposer la création d'un compte. J'ai donc fait le choix de stocker les données directement dans le navigateur, avec la possibilité de les exporter et de les restaurer grâce à un fichier JSON.
Cette approche m'a aussi amené à travailler sur des aspects moins visibles, mais essentiels : empêcher les données invalides d'être importées, gérer les erreurs de stockage et éviter les pertes accidentelles lors d'une restauration. J'ai accompagné ce travail de tests automatisés et de vérifications manuelles pour fiabiliser les différents parcours.
Déploiement et retour
d'expérience
Après plusieurs itérations, LiftBoard est désormais en ligne sur Cloudflare Pages, avec son code versionné sur GitHub. L'application est utilisable sans inscription et regroupe les fonctionnalités essentielles que je souhaitais développer pour cette première version.
Au-delà du résultat, c'est surtout un projet qui m'a fait progresser. J'ai découvert de nouvelles problématiques, revu certains choix et appris à mieux structurer une application React/TypeScript. LiftBoard reste perfectible, mais il représente une étape importante et essentiel dans mon évolution vers le développement frontend.
Stack utilisée
React
localStorage
TypeScript
Git
Vite
GitHub
CSS3
Cloudflare Pages