Building Agentic Websites End-to-End: OpenAI, Next.js, n8n & Sanity

An agentic website is a normal website that can do things: answer product questions, qualify a lead, trigger a follow-up, pull the right content at the right moment. The stack I use to build them — and the one behind the gig I offer on Fiverr — is OpenAI, Next.js, n8n, and Sanity CMS. This is how the four pieces fit together.

The four pieces

• Next.js — the UI and the entry point: server components for rendering, route handlers for the agent's API, streaming responses so the user sees tokens as they arrive.
• OpenAI — the reasoning layer: models, tool calling, and structured outputs. The agent loop lives here.
• n8n — orchestration for everything that outlives a request: webhooks, retries, and connectors to CRMs, email, and sheets.
• Sanity CMS — structured content with GROQ queries and a hosted Studio, so editors publish without touching code or waiting for a deploy.

A reference architecture

One request flows through the system in one direction:

1. A Next.js server component renders the page and fetches content from Sanity at build or request time.
2. A user action hits a route handler. The OpenAI key stays on the server — never in the browser bundle.
3. The agent loop runs: prompt, tools, model decision. Tool results and structured outputs are schema-validated before anything acts on them.
4. Side effects — emails, CRM updates, enrichment — are handed to an n8n webhook, where retries and logging already exist.
5. The model's answer streams back into the UI while the workflow continues in the background.

Why the content lives in a CMS, not in code

Content changes at editor speed; code changes at engineering speed. Keeping articles, pages, and copy in Sanity means a non-developer can publish without a git commit or a deploy. This very portfolio runs on Next.js with an embedded Sanity Studio — the post you are reading was authored there.

Where n8n earns its place

An agent answer is request-time work measured in seconds. Business workflows are human-time work measured in minutes or days: lead follow-ups, enrichment, notifications, handoffs. n8n owns that half with durable executions and retries, so the model never has to wait on a slow external API — and the workflow survives a timeout.

Guardrails I keep by default

• Schema-validate every structured output before acting on it.
• Human approval for anything that sends externally — email, SMS, invoices.
• Secrets server-side only, tool calls logged, and token/loop caps to keep costs predictable.

Agentic features earn their place only when they remove friction — answering the same question for the hundredth time, qualifying a lead at 2 a.m., moving data between tools that should have talked anyway. Everything else stays a plain, fast page. If you are planning an agentic build and want a second pair of hands, get in touch.