Claude Artifacts + React : Un enseignant crée un mini-golf pour des leçons d'angles en 20 minutes
Un enseignant (u/cram213) a utilisé Claude pour développer rapidement un jeu de mini-golf qui enseigne les angles, contournant les restrictions scolaires en exportant les Artifacts vers du HTML brut. L'ensemble du processus — de la commande vocale sur un téléphone à la publication d'un jeu web — a pris environ 20 minutes.
Processus
- Construction initiale : À l'aide de la fonctionnalité Artifact de Claude avec React, l'enseignant a créé un jeu de mini-golf jouable pour démontrer visuellement les angles. L'école utilise Gemini, donc les URLs des Artifacts publiés étaient inaccessibles.
- Solution de contournement : L'enseignant a demandé à Claude de convertir l'Artifact en un fichier HTML autonome, puis l'a hébergé sur un site personnel (constraintlayer.ai/educational-engines/golf.html).
- Itération : Le processus a consisté à parler au téléphone pour les commandes, puis à donner un retour à Claude après avoir testé le jeu dans l'aperçu de l'Artifact.
- Extension pour les élèves : Après avoir joué, les élèves ont dessiné leurs propres parcours sur papier. L'enseignant a téléversé chaque dessin dans Claude, et en environ une minute, la classe a pu jouer sur leurs parcours personnalisés.
Point technique clé
L'enseignant insiste sur l'importance de penser comme un ingénieur système : décrire le problème, prévoir les cas limites (« les bêtises que les élèves pourraient faire ») et choisir le bon format de sortie en fonction de vos contraintes de déploiement. Les Artifacts avec React sont parfaits pour le prototypage, mais l'exportation en HTML simple (sans dépendances externes) garantit un fonctionnement sur n'importe quel réseau scolaire — pas besoin de Gemini, ni d'URL d'Artifact Claude.
📖 Lire la source complète : r/ClaudeAI
👀 See Also
Architecture des Agents OpenClaw : Délégation Multi-Agents, Mémoire à 5 Couches et Systèmes de Surveillance
Un développeur partage des modèles d'architecture OpenClaw pratiques après 7 semaines d'utilisation, incluant la délégation multi-agent avec des modèles spécialisés, un système de mémoire à 5 couches avec dégradation, et un système de surveillance avec trois niveaux de monitoring.
Agensi : Une Place de Marché pour SKILL.md Construite avec Claude en 3 Semaines
Agensi est une place de marché pour les compétences SKILL.md construite à l'aide de Claude Code, Lovable et Supabase. La plateforme comprend 37 compétences réparties en 8 catégories, avec des fonctionnalités telles que l'analyse de sécurité automatisée, l'empreinte numérique des téléchargements et un système de demandes de primes.
Parallélisation massive du code Claude : Leçons tirées de la construction d'une application de 220 000 lignes
Un développeur sans formation formelle en programmation a créé une application mobile full-stack en utilisant Claude Code, en exécutant 3 à 4 instances parallèles pour traiter 4 milliards de tokens sur plus de 500 fichiers. Les techniques clés incluent des documents de transfert, des fichiers CLAUDE.md, des commandes slash personnalisées et des audits systématiques du code source.
Le développeur utilise des agents de code Claude pour résoudre 635 problèmes sur 42 jeux de société en une seule session.
Un développeur solo a utilisé des agents Claude Code pour corriger 635 problèmes d'interface utilisateur et d'expérience utilisateur sur 42 jeux de société multijoueurs en une seule session, aboutissant à 325 commits tout en maintenant zéro erreur de compilation. Le flux de travail impliquait l'exécution de quatre agents simultanément, chacun traitant un seul problème provenant de jeux différents pour éviter les conflits de fichiers.