Réalisation d'un générateur de site statique depuis Airtable
Alexis crée un générateur de sites statiques en PHP avec Windsurf pour présenter ses sessions de vibe coding à partir de sa base Airtable, en explorant différentes architectures web.
Stack technique
Outils utilisés
Résumé de la session
Alexis a commencé par expliquer son projet : créer un site web qui liste ses sessions de vibe coding à partir de sa base Airtable contenant tous ses contenus (podcasts, vidéos, transcripts, etc.). Il a présenté trois architectures possibles : appel direct à l'API Airtable (problématique pour la scalabilité), génération d'un JSON statique (mieux), et générateur de sites statiques (son choix final).
Il a ouvert Windsurf et utilisé le modèle SWE-1, le nouveau modèle maison de Windsurf qu'il voulait tester. Alexis a créé un projet from scratch en mode chat d'abord, expliquant le contexte à l'IA : site listant des vidéos de live coding avec page d'index et pages détail. Il a fourni l'URL de sa vue Airtable et configuré l'API avec une clé en lecture seule.
L'IA a proposé un plan d'implémentation complet et posé des questions pertinentes sur la pagination, les filtres, le design. Alexis a répondu en utilisant son outil de transcription vocal pour gagner du temps, précisant ses besoins et préférences.
Le modèle SWE-1 a généré un projet complet avec fichier de configuration, templates, générateur PHP, et même une licence MIT non demandée. Malgré une erreur de syntaxe mineure (parenthèse manquante), l'ensemble fonctionnait. Le script a généré les pages HTML statiques avec succès.
Cependant, Alexis a identifié plusieurs problèmes : URLs basées sur les titres au lieu des GUID (mauvaise pratique), fichier de configuration avec clé API non ignoré par Git (problème de sécurité), et embeds vidéo affichés directement au lieu d'images de couverture.
Il a corrigé le problème de sécurité en ajoutant le fichier config au .gitignore et en créant un fichier d'exemple, puis a versionné le projet proprement.
Il a ouvert Windsurf et utilisé le modèle SWE-1, le nouveau modèle maison de Windsurf qu'il voulait tester. Alexis a créé un projet from scratch en mode chat d'abord, expliquant le contexte à l'IA : site listant des vidéos de live coding avec page d'index et pages détail. Il a fourni l'URL de sa vue Airtable et configuré l'API avec une clé en lecture seule.
L'IA a proposé un plan d'implémentation complet et posé des questions pertinentes sur la pagination, les filtres, le design. Alexis a répondu en utilisant son outil de transcription vocal pour gagner du temps, précisant ses besoins et préférences.
Le modèle SWE-1 a généré un projet complet avec fichier de configuration, templates, générateur PHP, et même une licence MIT non demandée. Malgré une erreur de syntaxe mineure (parenthèse manquante), l'ensemble fonctionnait. Le script a généré les pages HTML statiques avec succès.
Cependant, Alexis a identifié plusieurs problèmes : URLs basées sur les titres au lieu des GUID (mauvaise pratique), fichier de configuration avec clé API non ignoré par Git (problème de sécurité), et embeds vidéo affichés directement au lieu d'images de couverture.
Il a corrigé le problème de sécurité en ajoutant le fichier config au .gitignore et en créant un fichier d'exemple, puis a versionné le projet proprement.