Développeur Construit un Produit SaaS Complet avec Claude Cowork : Application MLB Scoreboard avec Authentification, Paiements et Widget Intégrable

Aperçu du projet

Un développeur a construit un produit SaaS complet appelé ScorePorch en utilisant des sessions Claude Cowork. ScorePorch est une application de tableau de scores MLB personnalisée qui comprend une interface frontend, un backend, une authentification, des paiements et un widget intégrable.

Stack technique

• Frontend : Vite + React
• Backend : API serverless Express/Vercel
• Authentification : Supabase (email + Google OAuth)
• Paiements : Stripe avec synchronisation par webhook
• Source de données : API MLB Stats pour les données en direct
• Actualités : flux RSS de MLB.com

Fonctionnalités de l'application

Les utilisateurs sélectionnent leur équipe favorite et reçoivent un tableau de bord aux couleurs de cette équipe. Le tableau de bord comprend :

• Les scores en direct
• Les classements de division
• Un compte à rebours pour le prochain match
• Des actualités spécifiques à l'équipe provenant des flux RSS de MLB.com
• Les feuilles de match complètes

La version gratuite donne accès à une équipe, tandis que les formules payantes débloquent la fonctionnalité multi-équipes et un widget intégrable.

Détails du widget intégré

Le widget intégré a été construit comme un composant isolé par Shadow DOM et réactif aux requêtes de conteneur, qui peut être ajouté à n'importe quel site web avec une simple balise script. Le widget pèse 23 Ko au total et n'a aucune dépendance. Claude Cowork a aidé à développer la stratégie d'isolation pour empêcher le CSS du widget de s'infiltrer dans les pages hôtes.

Expérience de développement avec Claude Cowork

Le développeur a noté que Cowork a géré efficacement l'ensemble du cycle de vie du produit, pas seulement la génération de code. Les tâches collaboratives spécifiques comprenaient :

• L'itération sur les flux d'authentification
• Le débogage des cas limites des webhooks Stripe
• La résolution des problèmes CORS pour les requêtes cross-origin du widget
• La construction d'une page de destination Framer

La continuité du contexte entre les sessions a donné l'impression de travailler avec un cofondateur qui se souvient du travail précédent.

Défis rencontrés

• Authentification : le flux PKCE cassait constamment le callback, nécessitant un passage au flux implicite
• Limitations de l'API : l'API d'ESPN était pratiquement morte, nécessitant un pivot vers les flux RSS de MLB.com pour les actualités
• Intégration Git : Cowork ne peut pas pousser directement sur git (EPERM sur index.lock), nécessitant une solution de contournement où le développeur clone dans /tmp et pousse depuis là

Développement supplémentaire

Le développeur a créé un plugin Cowork pour ScorePorch, permettant à d'autres développeurs construisant des tableaux de bord d'ajouter un tableau de scores MLB en direct à leurs projets en utilisant /add-scoreboard [nom-équipe]. Le plugin comprend des guides d'intégration pour React, Next, Vue, Svelte, WordPress, Squarespace et Webflow.

L'application est en ligne sur app.scoreporch.com.