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

Système de mémoire persistante sans code pour Claude utilisant Notion et MCP
Tools

Système de mémoire persistante sans code pour Claude utilisant Notion et MCP

Un radiologue a construit un 'Hub Cognitif' dans Notion que Claude lit et écrit via MCP, créant une base de connaissances structurée avec une table de routage pour charger uniquement les informations pertinentes par conversation. Le système a atteint plus de 70 pages après un mois d'utilisation quotidienne.

OpenClawRadar
Ninetails Memory Engine V4.5 : Quantification Int8 + Cache LRU réduit la mémoire MCP locale à 60 Mo
Tools

Ninetails Memory Engine V4.5 : Quantification Int8 + Cache LRU réduit la mémoire MCP locale à 60 Mo

Le moteur de mémoire Ninetails V4.5 utilise la quantification scalaire Int8 et l'éviction de cache LRU pour réduire le stockage vectoriel de 6 Ko à 1,5 Ko par plongement, maintenant l'ensemble du moteur entre 40 et 60 Mo de RAM. Il combine 70 % de similarité vectorielle avec 30 % de recherche BM25 dans une implémentation SQLite entièrement locale.

OpenClawRadar
Formateur de messages Slack : Corriger le Markdown cassé de Claude dans Slack
Tools

Formateur de messages Slack : Corriger le Markdown cassé de Claude dans Slack

Un développeur a créé une compétence qui convertit le Markdown généré par Claude en un formatage Slack approprié, résolvant les problèmes où le texte en gras s'affiche avec des astérisques, les liens apparaissent bruts et les tableaux se cassent. L'outil propose à la fois un aperçu navigateur avec copier-coller HTML enrichi et une prise en charge de webhook API.

OpenClawRadar
Exploiter le Code Claude pour le Conseil en Bots : Une Analyse Approfondie
Tools

Exploiter le Code Claude pour le Conseil en Bots : Une Analyse Approfondie

Exploration de l'intégration de Claude Code dans le développement de bots pour améliorer les fonctionnalités grâce à un conseil en IA, comme partagé par un passionné sur r/clawdbot.

OpenClawRadar