#Add an AI agent to the app you built in Bolt.new
There are two steps. Step 1 works from any chat. Step 2 needs the Bolt project on your computer.
Step 1: create the agent from a chat. In Claude, ChatGPT or Cursor, add the remote MCP server https://vatio.ai/mcp as a connector, sign in with a Vatio account and ask for the agent. It is created in a preview you can try. Nothing reaches your users until you publish it. Details: Vatio in Claude and ChatGPT (MCP).
Step 2: build the agent into the app. Connect the Bolt project to GitHub, clone the repository, open it in Claude Code or Cursor and run:
npx @vatio-ai/skills/vatio-init/vatio-init reads the app and creates the agent, or finds the one from step 1. Then ask your coding agent to put the web widget in the app. /vatio-improve is the daily routine afterwards (Improve your agent). Vatio runs the conversations.
#Get your project into Claude Code or Cursor
- Open your project in Bolt and click the GitHub icon in the top-right corner.
- The first time, click Log in to GitHub, Authorize StackBlitz (Bolt's parent company), Install the GitHub App, choose All repositories or Only select repositories, and click Install & Authorize.
- Enter a name for the repository and click Create repository. It starts as a private repository on a
mainbranch. - Clone the repository on your computer and open the folder in Claude Code or Cursor. You need Node.js 20 or newer.
Only the project's owner can connect GitHub. If you started the project by importing a repository from GitHub, it is already there. Export → Download gives you a .zip, but nothing you change in it gets back to Bolt, so use GitHub.
In Claude Code, run the first command in a terminal in the cloned project and the second in Claude Code. In Cursor or Codex, ask it to use vatio-init. The first time vatio-init pushes the agent, your browser opens to sign in with email, Google or GitHub.
#What vatio-init finds in a Bolt project
vatio-init first looks for a vatio.yml in the repository. If there is one, the agent already exists and it works on that one. Then it reads the app. In a Bolt project that usually means:
- A database. New Bolt projects use Bolt Database. On a Pro or Teams plan, a project can use Supabase instead: chosen when the project started, connected later, or a Bolt Database claimed in Supabase.
- Server functions. Bolt writes backend code as server functions, also called edge functions. The agent's tools can call them to read or change a user's data.
- Sign-in. Email or Google, set up in Bolt's database settings.
- Your pages. Help text, pricing and policies can become knowledge entries.
Vatio runs your tools from its servers, so a tool calls an address on the internet, never your computer. The secrets a tool reads, like your backend's address, are kept in Vatio and not in the repository.
#Your users, signed in
Which path applies depends on the database. For how tokens and private tools work, see Authentication and Private tools.
Bolt uses Supabase or Bolt Database. Either way your backend signs a short-lived token for whoever is signed in, with the key from vatio auth --new-key. With Supabase, that is an Edge Function that reads the user's Supabase session and signs the token; with Bolt Database, a server function that does the same for the signed-in user. Your coding agent can add it. Store the private key in the function's secrets (Bolt's Secrets settings, or Supabase's). The public half, identity.pub, stays in the repository. Private tools then call your Edge Functions or server routes, which verify the token and read only the rows of $auth.subject.
#Put the agent in your app
Your coding agent adds the web widget: a script tag, or the @vatio-ai/widget package mounted when the page loads. With a signed token, the app hands it to the widget with widget.identify(token).
Origins: every publishable key accepts any https subdomain of bolt.host and webcontainer-api.io, Bolt's published and preview addresses, without listing them. A custom domain (Bolt's paid plans) or a site still published through Netlify must be added: run vatio keys origins or use Settings → API keys in the inbox. A page on an origin the key does not accept gets origin_not_allowed, and the browser console names the origin to add.
Use preview's key while you try the agent, and switch to a live key when you publish.
#Keep building in Bolt
Commit vatio.yml, tools/, the knowledge and the widget code, and push. Bolt checks GitHub every 30 seconds and pulls in changes made outside it, and commits every change you make in Bolt that doesn't break the project.
- Don't build in Bolt while you push. When Bolt and GitHub change at almost the same moment, Bolt keeps its version and overwrites GitHub's.
- Merge on GitHub. Bolt doesn't merge branches itself. Work on a branch if you like and merge it into
mainon GitHub. - Protect the agent's files. Add a line to the project's Knowledge in Bolt's project settings, such as "vatio.yml, tools/ and knowledge/ belong to the Vatio agent; don't change them."
- Pull before you work. Before running vatio-init or
/vatio-improveagain, pull, so your clone has what Bolt built since.
If a Bolt change renames an endpoint a tool calls, that tool's calls start failing. vatio tools --env live shows each tool's errors.
#Try it, then publish
vatio-init links to the inbox, where Try the agent opens, with WhatsApp, Instagram and a web chat. The web chat is a visitor who isn't signed in, so it only reaches public tools. To try what a signed-in user gets, open your app in Bolt's preview with the preview's widget in it and sign in as a test user.
When it does what you want, tell your coding agent to publish, switch the widget to a live key and publish your app from Bolt's Publish menu with Update. Publishing the agent and publishing the Bolt app are separate. Pricing: https://vatio.ai/pricing.
#Sources
Checked on 14 October 2026.
- Bolt: GitHub for version control
- Bolt: Database
- Bolt: Database authentication settings
- Bolt: Supabase for databases
- Bolt: Publish your project to a live website
- Bolt: Backups and version history
#Frequently asked questions
#Can the agent know which user of my Bolt app it is talking to?
Yes. Whether sign-in runs on Supabase or Bolt Database, your backend signs a short-lived token for whoever is signed in, and your coding agent can add that as an Edge Function or a server function. The app hands the token to the widget.
#Does the Vatio widget work on bolt.host?
Yes. Every publishable key accepts any https subdomain of bolt.host and webcontainer-api.io without listing them. A custom domain, or a site still published through Netlify, has to be added to the key's origins.
#Can I keep building in Bolt after adding a Vatio agent?
Yes. Bolt commits your changes to GitHub and checks GitHub every 30 seconds for commits made outside Bolt, so what your coding agent pushes appears in Bolt. Don't build in Bolt while you push, because when both change at once Bolt keeps its own version.
#Related guides
- Lovable apps: Sync your Lovable project to GitHub, run the steps in Claude Code or Cursor, and keep building in Lovable.
- Build an AI agent: Instructions, knowledge, tools and publishing.
- An AI chat for your web app or site: The web widget in your app.
- Improve your agent: Report mistakes in the inbox and fix them with /vatio-improve.