For AI builders

All the benefits of AI development and custom code, none of the backend headaches.

AI tools like v0, Bolt, and Lovable create stunning frontends in seconds. But a frontend without a backend is a prototype, not a product.

Book a demo See the integration

The Gap

What AI-generated frontends are missing. Beautiful UI in seconds. But without a backend, it's just a demo.

AI generates beautiful UI. v0, Bolt, and Lovable ship a polished frontend in seconds.
The site sits alone. No backend. Forms go nowhere, there is no analytics, no CRM, no SEO management, no real commerce.
Connected to Sonor, data flows. The same frontend, now wired to leads, analytics, SEO, commerce, and Echo.

Without SonorWith Sonor

Form submissions go nowhere
Leads in CRM with scoring
No analytics
Full analytics with AI insights
No CRM
Full CRM with pipeline & deals
No SEO management
Managed SEO with A/B testing
No real commerce
Real commerce with checkout

Bridge the Gap

Add @sonordev/site-kit to any Next.js project. Instantly get:

Leads in CRM with scoring. Your contact form stops being a dead end: every submission lands in the pipeline, scored.
Managed SEO with A/B testing. A static page becomes a managed one: metadata, schema, and experiments handled for you.
Full analytics with AI insights. No data becomes every page view, conversion, and web vital, with Signal reading the trends.
Real commerce with checkout. Placeholder products become real ones, with carts, checkout, and payments.
Echo AI that knows your business. No chat becomes a conversation grounded in your leads, traffic, and content.

5-Minute Integration

Three files. Real backend. Drop these into any Next.js project, AI-generated or hand-coded.

app/layout.tsx. SiteKitLayout wraps your app once.
app/page.tsx. ManagedSchema adds structured data to any page.
ContactForm.tsx. useForm routes submissions into the CRM.

Book a demo

app/layout.tsx

import { SiteKitLayout } from '@sonordev/site-kit/layout'
 
export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        <SiteKitLayout>{children}</SiteKitLayout>
      </body>
    </html>
  )
}

Building with a coding agent?

Hand it one line.

The Sonor docs are written for the agent as much as for you. It reads them as Markdown, looks things up over MCP, and runs the CLI with --json, so it wires your site the way every Sonor site is wired, then checks its own work.

The guide for coding agents

Tell your coding agent

This project uses Sonor. Follow sonor.dev.

Any page as Markdown: sonor.dev/<page>.md
Every page, one file: sonor.dev/llms.txt
MCP server: sonor.dev/api/mcp
Wire it, then prove it: npx sonor-setup verify --json

Your AI-generated frontend deserves a real backend.

Add Sonor in minutes. Forms, analytics, CRM, commerce, and Echo AI, all from one npm install.

Book a demo View docs

See what you'll pay

One platform, transparent pricing. Every module included from $99/mo.

Pricing details

Start building

One npm install. 22 modules. 100+ typed components for Next.js.

Integration options