Application web de recommandations musicales géolocalisées
Alexis crée une application PWA qui génère des playlists musicales basées sur la géolocalisation en combinant Windsurf, une API PHP, Claude Haiku et N8N pour Spotify.
À propos de cette session
Alexis a commencé par une préparation méthodologique exemplaire : création d'un schéma d'architecture dans Whimsical, puis génération des user stories complètes avec Claude qu'il a importées dans Airtable pour un suivi structuré. Son idée : une app qui propose de la musique locale en fonction de la géolocalisation de l'utilisateur.
Il a d'abord tenté de développer avec Bolt, mais des problèmes récurrents de connexion serveur l'ont obligé à abandonner et passer sur Windsurf. Il a dû exporter le code de Bolt et le reprendre dans un environnement local.
Alexis a ensuite construit progressivement son application : d'abord la géolocalisation, puis une API PHP pour le reverse geocoding via OpenStreetMap, suivie de l'intégration de Claude Haiku pour générer des mots-clés musicaux en fonction du lieu.
Pour l'intégration Spotify, face à la complexité de l'OAuth, il a opté pour une approche hybride en créant un workflow N8N qui gère l'authentification Spotify et expose un webhook. Son API PHP appelle ce webhook avec les mots-clés pour récupérer des tracks.
Malgré quelques difficultés de configuration N8N (agrégation des résultats, URLs de test vs production), l'application finale fonctionne : elle géolocalise l'utilisateur, génère des mots-clés musicaux contextuels, récupère des morceaux Spotify correspondants et les affiche avec des embeds jouables.
Points clés
- Valeur de la planification préalable - L'approche méthodologique (Whimsical + Claude + Airtable) s'avère très structurante versus l'improvisation
- Fragilité des environnements cloud - Les bugs de connexion Bolt illustrent la dépendance aux services externes et leurs limites
- Puissance de l'architecture modulaire - La séparation frontend/API PHP/N8N permet de contourner les complexités d'intégration
- Pertinence du mix code/no-code - Utiliser N8N pour Spotify OAuth plutôt que coder l'authentification s'avère plus pragmatique
- Importance du versioning régulier - Les commits fréquents permettent les rollbacks en cas de problème
- Limites de la fenêtre de contexte - Windsurf ne lit que des fragments de fichiers, pas la totalité du projet
- Sous-estimation systématique des délais - 2h pour une app "simple" montre que le vibe coding prend plus de temps que prévu
- Valeur des boucles de feedback courtes - Tester chaque fonctionnalité avant de passer à la suivante évite l'accumulation d'erreurs
- Avantages du PHP pour l'hébergement - Plus simple à déployer que Python pour les projets hybrides
- Nécessité de compétences techniques - Debugging des problèmes d'environnement, configuration N8N, etc. restent complexes
- Efficacité des LLM pour la génération de contenu - Claude excellent pour créer user stories, prompts et même code d'embed
- Importance des prompts de fin de projet - Nettoyer les console.log, optimiser le code final sont des étapes souvent oubliées