WolfFuel

Contexte

Les applications de comparaison de carburant existantes souffrent d'une interface vieillissante, d'une carte difficilement lisible sur mobile et d'un manque de personnalisation. Les automobilistes perdent du temps à comparer manuellement les prix dans leur zone.

WolfFuel est né de ce constat simple : il manquait une solution moderne, rapide et réellement utile au quotidien.

Solution

WolfFuel propose une cartographie interactive des stations-service avec :

• Filtrage en temps réel par type de carburant (SP95, SP98, Gazole, E85, GPL)
• Géolocalisation automatique pour afficher les stations les plus proches
• Alertes de prix par email ou notification push
• Historique des prix avec graphiques de tendance
• Accès anticipé avec abonnement via Stripe

Stack technique

Frontend

• Next.js 15 avec App Router et React Server Components
• Tailwind CSS v4 pour un design system CSS-first
• Framer Motion pour les animations de carte
• Mapbox GL pour la cartographie interactive

Backend & données

• Supabase (PostgreSQL + Row Level Security + Realtime)
• API gouvernementale des prix des carburants (data.gouv.fr)
• Cron jobs via Vercel pour la mise à jour des données toutes les heures

Paiement & accès

• Stripe Checkout pour l'accès anticipé
• Stripe Webhooks pour la gestion des abonnements
• Supabase Auth avec accès basé sur les rôles

Résultats

• Score Lighthouse 95+ en performance, accessibilité et SEO
• Mise en ligne en accès anticipé depuis 2026 sur wolffuel.fr
• Données actualisées toutes les heures depuis l'API officielle
• Interface mobile-first avec PWA installable

Ce que j'ai appris

Ce projet m'a permis d'approfondir l'intégration de Stripe Webhooks en production, la gestion de données géospatiales avec PostGIS dans Supabase, et l'optimisation des performances avec les React Server Components de Next.js 15.