All Systems Operational
Powered By
profound-logo
profound-logoProfound CMS
⌘K
Admin

Json Et Claude Code

Créer des schémas avec Claude Code et le générateur JSON

Continue Reading
Previous‹Démarrage rapideNextRécupération du schéma Zod du composant›

Hybride

Renderer ProjetRoutage paramétriqueTypes de composantsSseConfigurer Proxy Panneau AdminRendu statique avec prise en charge du mode éditionScripts dans le générateur de modèlesCreate Profound Next

Sans tête

Démarrage rapideJson Et Claude CodeRécupération du schéma Zod du composant

Mcp

Mcp

fonctionnalités du CMS

Feat Docs TemplateGénérateur de modèles de fonctionnalitéFonctionnalité TraducteurFonctionnalité Organisation

Motivation

Notre approche

Terminologie

Hybride Vs Sans Interface

Flux de travail Claude Code

Connectez-vous d'abord à notre serveur MCP

claude mcp add --transport http Profound http://107.21.107.99:8081/mcp

Vous pouvez commencer à utiliser des outils et des composants pour créer en masse des documents/blocs/composants et publier des sites web rapidement.

Voici le processus manuel

Pour lancer l'éditeur de schémas JSON Zod.

  • Accédez au panneau d'administration du CMS
  • Cliquez sur + Créer un schéma
  • Saisissez la description JSON validée appropriée du schéma
  • Appliquez les modifications

Pour les modifications ultérieures, le schéma devra être supprimé puis ajouté de nouveau.

Solliciter Claude pour le flux de travail JSON

Si nous utilisons Claude Code pour des modifications visuelles TailwindCSS/CSS/React, nous pouvons également lui demander de mettre à jour correctement le JSON en utilisant un serveur MCP ou en vous fournissant le JSON à coller dans l'éditeur de code.

Demandez simplement à Claude le JSON approprié pour les composants pour lesquels vous souhaitez créer un schéma, qu'il s'agisse d'un CMS hybride ou simplement d'un CMS headless.

Exemple

Nous ajoutons une nouvelle fonctionnalité de serveur MCP et, pour l'afficher, nous ajoutons un nouveau hero block.

Nous allons d'abord modifier notre registre pour utiliser un nouveau bloc

const registry = {
  "navbar": NavbarBlock,
  ...
  // new block added
  "McpFeatureBlock": McpFeatureDisplayBlock,
  ...
  "footer": FooterBlock,
};

Demandez à Claude d'implémenter le React/CSS du bloc et de nous fournir le JSON pour la définition du schéma. Cela devrait ressembler à ceci.

"McpFeatureBlock": {
  "label": "Serveur MCP",
  "title": "Laissez les agents IA gérer directement votre CMS",
  "description": "Profound CMS est livré avec un serveur MCP natif. Connectez Claude, Cursor ou tout agent compatible MCP et laissez-le lire les pages, mettre à jour les blocs et publier du contenu — aucun code intermédiaire personnalisé n'est nécessaire.",
  "features": ["McpFeatureItem"],
  "cta_label": "Lire la documentation MCP",

Nous collons ceci dans l'onglet "Importer du code" de l'éditeur de schémas. Cela devrait ressembler à ce qui suit.

Après cela, créez le bloc qui utilise le schéma mcp_feature_block et référencez ce bloc à l'aide du générateur de modèles dans la page.

Résumé

Il s'agit d'un flux de travail personnalisé Claude + Profound CMS.

"cta_href": "/docs/mcp"
}