Skip to main content
This snippet wires Neural Draft into Nuxt 3 with two pieces: a typed composable for client and server use, and a webhook handler with HMAC verification.

Install

Runtime config

Server-side composable

Server-only — uses the secret API key. Importable from ~/server/api/* and plugins.

A blog index server route

A blog page

Webhook handler

A composable for client-side public reads

For unauthenticated reads (e.g. public product catalogue), use the public API directly from the browser.

Hand this to your AI

“Add a /services page that lists every active bookable service from Neural Draft. In server/api/services.get.ts, call getNeuralDraft(event).booking.listServices({ status: 'active', page_size: 50 }). In the page component, render each service with data-translate keys derived from its slug. For each service, also render the embed snippet returned by nd.booking.getWidget(tenantId, service.id) — get tenantId once from nd.projects.me().”
With @neuraldraft/mcp running, the AI will also call register_component for each section so the customer can edit copy inline in the admin.

Notes

  • Always read raw body in the webhook handler. readBody() parses JSON and breaks the HMAC; use readRawBody().
  • Public endpoints don’t accept your API key — use useNeuralDraftPublic directly from the browser only for /v1/public/* routes.
  • For multi-language sites, parameterise lang in your fetches and key your cache by locale.