DAUB MCP Server Permet à Claude de Générer et Rendre des Interfaces Utilisateur via des Spécifications JSON

✍️ OpenClawRadar📅 Publié: March 13, 2026🔗 Source
DAUB MCP Server Permet à Claude de Générer et Rendre des Interfaces Utilisateur via des Spécifications JSON
Ad

DAUB est un serveur MCP conçu spécifiquement pour Claude qui contourne le flux de travail traditionnel de développement d'interface utilisateur où Claude génère du code (comme JSX/HTML) que les développeurs copient, collent, compilent et déboguent. Au lieu de cela, Claude peut directement générer et afficher des interfaces utilisateur complètes.

Fonctionnement

Lors de l'utilisation de Claude avec DAUB, le flux de travail est :

  • Claude appelle generate_ui("J'ai besoin d'un tableau de bord avec un graphique des dépenses, des filtres et un tableau de données")
  • Le serveur MCP de DAUB génère une spécification JSON structurée
  • DAUB affiche cette spécification comme une interface en direct immédiatement—aucune compilation ni copier-coller requis
  • Claude peut ensuite appeler validate_spec ou render_spec pour itérer sur la conception sur plusieurs tours de conversation

Outils du serveur MCP

Le serveur MCP, qui fonctionne sur Cloudflare edge, expose quatre outils spécifiques :

  • generate_ui : Convertit les descriptions en langage naturel en interfaces affichées
  • render_spec : Prend une spécification JSON et renvoie un rendu en direct
  • validate_spec : Permet à Claude de vérifier sa propre sortie avant l'affichage
  • get_component_catalog : Permet à Claude de parcourir 76 composants dans 34 catégories pour sélectionner les éléments d'interface appropriés
Ad

Détails techniques

Le format de spécification JSON est intentionnellement simple pour garantir que Claude puisse le produire de manière fiable. Il couvre la mise en page, la typographie, les formulaires, les tableaux, la navigation, l'affichage des données et les superpositions. Claude peut comparer les spécifications entre les tours et itérer sans repartir de zéro.

Le côté rendu ne nécessite que deux fichiers CDN : daub.css et daub.js. Il inclut 20 familles de thèmes visuels et ne nécessite aucune étape de construction.

L'ensemble du projet a été construit avec Claude Code pendant le développement, le format de spécification ayant été fortement itéré avec Claude pour garantir une génération cohérente sans inventer de noms de composants.

Disponibilité

DAUB est gratuit. Le dépôt GitHub est disponible à https://github.com/sliday/daub, et il y a un terrain de jeu à https://daub.dev/playground.html où vous pouvez l'essayer sans Claude. Une feuille de route est disponible à https://daub.dev/roadmap.

📖 Read the full source: r/ClaudeAI

Ad

👀 See Also

Résultats de référence : Quand utiliser Claude Opus avec Codex vs. Opus pur pour la génération de code
Tools

Résultats de référence : Quand utiliser Claude Opus avec Codex vs. Opus pur pour la génération de code

Un benchmark contrôlé a testé l'approche 'Planifier avec Opus, Exécuter avec Codex' sur trois tâches de codage réelles. Les résultats montrent un point de croisement des coûts à environ 600 lignes de code, avec des recommandations spécifiques basées sur la taille du projet.

OpenClawRadar
Outils CLI avec Compatibilité Agent IA : Approche par Répertoire de Compétences
Tools

Outils CLI avec Compatibilité Agent IA : Approche par Répertoire de Compétences

Un utilisateur de Reddit partage une méthode pour faire fonctionner les outils CLI avec des agents de codage IA comme Claude Code en créant des fichiers SKILL.md qui enseignent aux agents l'installation, l'authentification et l'utilisation. L'approche aborde les problèmes courants comme les invites interactives, la sortie JSON et les méthodes d'authentification.

OpenClawRadar
Un utilisateur de Reddit partage une invite détaillée pour exporter ses connaissances personnelles des assistants IA.
Tools

Un utilisateur de Reddit partage une invite détaillée pour exporter ses connaissances personnelles des assistants IA.

Un utilisateur de Reddit a créé un prompt complet pour extraire des connaissances personnelles structurées des assistants IA comme Claude, répondant aux limitations perçues de la fonction d'importation ChatGPT d'Anthropic. Le prompt génère trois artefacts JSON distincts couvrant les bases de connaissances personnelles, les cadres intellectuels et les graphes de connaissances.

OpenClawRadar
ClaudeHive : Interface Web pour Gérer des Sessions de Code Claude en Parallèle
Tools

ClaudeHive : Interface Web pour Gérer des Sessions de Code Claude en Parallèle

ClaudeHive est une interface web qui gère des sessions parallèles de Claude Code, permettant aux utilisateurs de définir des modèles de prompts avec des espaces réservés, de les exécuter par lots sur plusieurs entrées avec une concurrence configurable, et de consulter tous les résultats en un seul endroit. Il inclut un outil CLI pour que les agents gestionnaires puissent créer et coordonner des agents travailleurs.

OpenClawRadar