Skip to content
Browse documentation

Vibe coding your store

Vibe coding is how you build with NanoSite: you describe what you want in plain language, and the AI builds and edits the real code and content of your store. You stay in the driver's seat — reviewing, refining, and shipping — without writing the boilerplate yourself.

The workflow

  1. Describe your store. Start from a prompt ("a minimalist store for handmade candles") or pick a template as a starting point. The AI generates a complete storefront: pages, layout, branding, and a wired-up product catalog.
  2. Refine by chat. Ask for changes the way you'd ask a developer — "make the hero full-width," "add a subscription option to this product," "use a warmer color palette." The AI edits your store and shows you a live preview.
  3. Manage by chat. Add products, run promotions, and answer the day-to-day questions of running a store — all through the assistant, backed by the same commerce engine your storefront uses.
  4. Publish. When you're happy, publish. Your store goes live on a real, fast, server-rendered site.

What "you own your store" means

Your storefront is a real React application, and the commerce data behind it is yours:

  • Your code. The storefront is generated as source you can keep evolving with the AI.
  • Your data. Products, orders, and customers live in your store — you're not renting a locked catalog inside someone else's silo.
  • Your customers. You own the customer relationship, the emails, and the analytics.

Headless under the hood

Every store is built on our headless commerce architecture: a multi-tenant commerce backend exposed through a typed Ecommerce SDK, and a storefront that consumes it. That separation is what lets the AI (or you) restyle and restructure the storefront freely while the commerce logic — inventory, checkout, payments, tax — stays correct and consistent.

If you want to go deeper than chat, the SDK is fully documented: