Toulouse Sport Club
Toulouse Sport Club
Annuaire interactif des clubs de sport de Toulouse, alimenté par l'Open Data de Toulouse Métropole : recherche par sport et filtrage par quartier sur une carte. Créé en Symfony en 2019, puis réécrit en Next.js et TypeScript.
Le contexte
Trouver un club de sport près de chez soi à Toulouse n'a rien d'évident : l'information est éparpillée entre les sites des clubs, des fédérations et de la mairie. Pourtant, Toulouse Métropole publie en open data la liste des associations sportives de la ville. Ce projet est né d'une idée simple : rendre ces données publiques réellement utilisables par les habitants.
Le projet d'origine (2019)
J'ai d'abord développé Toulouse Sport Club en Symfony 4 comme projet de fin d'études. L'application importait les données ouvertes, les stockait en base et proposait une recherche des clubs par activité et par secteur.
La refonte en Next.js
J'ai récemment réécrit le projet de zéro avec Next.js et TypeScript, pour moderniser la stack et l'interface :
- Des données en direct : l'application interroge directement l'API Open Data de Toulouse Métropole (v2.1), ce qui supprime la base de données intermédiaire et les imports manuels. Les informations restent à jour d'elles-mêmes.
- Une carte découpée par quartiers : un clic sur un quartier filtre les clubs géographiquement.
- Une recherche libre par nom de club ou par activité, combinable avec le filtre par quartier.
- Une liste paginée de résultats, avec les informations utiles de chaque club.
- Une interface responsive en SCSS, pensée d'abord pour le mobile, puisque c'est souvent depuis un téléphone qu'on cherche une activité près de chez soi.
Le passage de Symfony à Next.js m'a aussi permis de comparer deux approches d'un même produit : un rendu serveur classique avec une base de données d'un côté, une application React consommant une API tierce de l'autre.
Le résultat
Un outil public et gratuit, qui transforme un jeu de données brut en service utile au quotidien. Le projet illustre aussi mon évolution technique, du PHP et de Symfony vers l'écosystème React, Next.js et TypeScript, sur lequel je travaille aujourd'hui.
Boite à outils du projet:
- Next.js
- Typescript
- Node
- Scss
- OpenData
- Git
