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

Json En Claude Code

Schema's bouwen met Claude Code en JSON-builder

Continue Reading
Previous‹SnelstartNextComponent Zod Ophalen›

Hybride

Renderer ProjectParametrische RouteringComponenttypenSseInstellen Beheerderspaneel ProxyStatische Rendering Met Ondersteuning Voor BewerkmodusScripting In SjabloonbouwerCreate Profound Next

Koploos

SnelstartJson En Claude CodeComponent Zod Ophalen

Mcp

Mcp

Cms Functies

Feat Docs TemplateFeat SjabloonbouwerFeat VertalerFeat Organisatie

Motivatie

Onze Aanpak

Terminologie

Hybride Vs Headless

Claude Code-werkstroom

Maak eerst verbinding met onze MCP-server

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

Je kunt direct tools en componenten gebruiken om snel documenten/blokken/componenten in bulk te maken en websites te publiceren.

Hieronder volgt het handmatige proces

Om de Zod JSON Schema-editor op te starten.

  • Ga naar het CMS-beheerpaneel
  • Klik op + Schema maken
  • Voer de juiste gevalideerde JSON-beschrijving van het schema in
  • Pas de wijzigingen toe

Voor latere wijzigingen moet het schema worden verwijderd en opnieuw toegevoegd.

Claude aansturen voor de JSON-werkstroom

Als we Claude Code gebruiken voor visuele TailwindCSS/CSS/React-wijzigingen, kunnen we hem ook vragen om de JSON correct bij te werken via een MCP-server of door je de JSON te geven die je in de code-editor moet plakken.

Vraag Claude gewoon om de juiste JSON voor de componenten waarvoor je een schema wilt maken, of het nu Hybrid of slechts een headless CMS is.

Voorbeeld

We voegen een nieuwe MCP-serverfunctie toe en om die te tonen voegen we een nieuw hero-blok toe.

Eerst passen we ons register aan om een nieuw blok te gebruiken

const registry = {
  "navbar": NavbarBlock,
  ...
  // nieuw blok toegevoegd
  "McpFeatureBlock": McpFeatureDisplayBlock,
  ...
  "footer": FooterBlock,
};

Vraag Claude om de React/CSS van het blok te implementeren en ons JSON voor de schemadefinitie te geven. Het zou er zo uit moeten zien.

"McpFeatureBlock": {
  "label": "MCP-server",
  "title": "Laat AI-agenten rechtstreeks met je CMS werken",
  "description": "Profound CMS wordt geleverd met een native MCP-server. Verbind Claude, Cursor of een MCP-compatibele agent en laat die pagina's lezen, blokken bijwerken en content publiceren — er is geen aangepaste gluecode nodig.",
  "features": ["McpFeatureItem"],
  "cta_label": "Lees de MCP-documentatie",

We plakken dit in het tabblad "Import Code" van de Schema-editor. Het zou er als volgt uit moeten zien.

Maak daarna het blok dat het schema mcp_feature_block gebruikt en verwijs naar dat blok via de sjabloonbouwer op de pagina.

Samenvatting

Dit is een aangepaste Claude + Profound CMS-werkstroom.

"cta_href"
:
"/docs/mcp"
}