profound-logoProfound CMS
⌘K
Admin
Theme
DocsGuidaBlogPhilosophy
DocsGuidaBlogPhilosophy

Hybrid

Instradamento parametricoTypes of ComponentsSetup server sent events (SSE) content refetchInstall Profound CMS as a proxyCEL Scripting in Template BuilderProject ScaffoldingMedia Library

Senza testa

Guida rapidaSplit Screen JSON Component Builder with LLMComponent Zod Pull

REST API

REST API OverviewgetConnect your websitegetGET /routesgetOttieni percorsogetGET /blocksgetGET /blocks/with-cel-cachegetGET /blocks/generatedgetGET /componentsgetGET /components/{name}getGET /dataset/{schema_name}getGET /content-changes (SSE)patchPATCH /dataset/{schema_name}postPOST /translationpatchPATCH /translationsgetGET /usagepostPOST /csvpatchPATCH /csv
All Systems Operational
Powered Byprofound-logo
Theme

Split Screen JSON Component Builder with LLM

Creare schemi con Claude Code e il generatore JSON

Innanzitutto connettiti al nostro server MCP

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

Puoi iniziare a utilizzare strumenti e componenti per creare rapidamente documenti/blocchi/componenti in massa e pubblicare siti web.

Di seguito la procedura manuale

Per avviare l'editor di schemi Zod JSON.

  • Vai al pannello di amministrazione del CMS
  • Clicca su + Crea schema
  • Inserisci la descrizione JSON convalidata appropriata dello schema
  • Applica le modifiche

Per le modifiche successive, sarà necessario eliminare lo schema e aggiungerlo nuovamente.


Richiedere a Claude il flusso JSON

Se utilizziamo Claude Code per le modifiche visive in TailwindCSS/CSS/React, possiamo anche chiedergli di aggiornare correttamente il JSON usando un server MCP oppure fornendoti il JSON da incollare nell'editor di codice.

Chiedi semplicemente a Claude il JSON appropriato per i componenti per cui vuoi creare uno schema, che sia ibrido o solo un CMS headless.


Esempio

Stiamo aggiungendo una nuova funzionalità del server MCP e, per mostrarla, stiamo aggiungendo un nuovo blocco hero.

Per prima cosa modificheremo il nostro registro per utilizzare un nuovo blocco

const registry = {
  "navbar": NavbarBlock,
  ...
  // nuovo blocco aggiunto
  "McpFeatureBlock": McpFeatureDisplayBlock,
  ...
  "footer": FooterBlock,
};

Chiedi a Claude di implementare il React/CSS del blocco e di fornirci il JSON per la definizione dello schema. Dovrebbe essere simile a questo.

"McpFeatureBlock": {
  "label": "Server MCP",
  "title": "Lascia che gli agenti AI lavorino direttamente sul tuo CMS",
  "description": "Profound CMS include un server MCP nativo. Collega Claude, Cursor o qualsiasi agente compatibile con MCP e consenti di leggere le pagine, aggiornare i blocchi e pubblicare contenuti — senza bisogno di codice personalizzato.",
  "features": ["ElementoFunzionalitàMcp"],
  "cta_label": "Leggi la documentazione MCP",
  "cta_href": "/docs/mcp"
}

Incollalo nell'editor JSON nel generatore di schemi. Dovrebbe apparire come mostrato di seguito.

Suggerimento: Preferisci Zod? Attiva il toggle dell'editor da JSON a Zod in cima al pannello e incolla invece uno schema Zod: il generatore ricaverà gli stessi campi. Utile se modelli già i dati con Zod altrove nella tua app.

Dopo di ciò, crea il blocco che utilizza lo schema mcp_feature_block e fai riferimento a quel blocco usando il generatore di template nella pagina.


Riepilogo

Questo è un flusso di lavoro personalizzato Claude + Profound CMS.

Continue Reading
Previous‹Guida rapidaNextComponent Zod Pull›