Skip to main content
This guide walks you through setting up the full Vibra Code stack: the Next.js backend, Convex database, Inngest job server, E2B sandbox template, and the iOS mobile app. By the end you will have a running system and your first AI-built app previewing on your phone.

Prerequisites

You need accounts and API keys for the following services before you start. Stripe and RevenueCat are optional — only needed if you want payment processing.
RequirementPurposeWhere to get it
ANTHROPIC_API_KEYAI code generation with Claude (default agent)console.anthropic.com
E2B_API_KEYCloud sandboxes for code executione2b.dev
Clerk publishable + secret keysAuthentication for backend and mobileclerk.com
Convex deployment URLReal-time databaseconvex.dev
You can use Cursor or Gemini instead of Claude by setting AGENT_TYPE=cursor or AGENT_TYPE=gemini and providing the corresponding API key. See the AI providers guide for details.

Backend setup

The backend is a Next.js 15 app with Convex for real-time data and Inngest for background job processing.
1

Clone the repository

Clone with submodules — the Expo template used inside sandboxes is included as a Git submodule.
git clone --recurse-submodules https://github.com/sa4hnd/vibra-code.git
cd vibra-code/vibracode-backend
2

Install dependencies

npm install
3

Configure environment variables

Copy the example file and fill in your API keys.
cp .env.example .env.local
Open .env.local and set at minimum:
ANTHROPIC_API_KEY=your_key_here
E2B_API_KEY=your_key_here
NEXT_PUBLIC_CONVEX_URL=https://your-deployment.convex.cloud
CONVEX_DEPLOYMENT=your-deployment-name
CLERK_SECRET_KEY=sk_live_...
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_live_...
The .env.example file contains comments explaining every variable. Optional integrations like Stripe, RevenueCat, and GitHub OAuth can be added later.
4

Deploy the Convex schema

This creates the real-time database tables (users, sessions, messages, and more) in your Convex project.
npx convex deploy
5

Start the Inngest dev server

Inngest processes background jobs — sandbox creation, agent runs, and GitHub pushes. Run it in a separate terminal.
npx inngest-cli@latest dev
The Inngest dashboard will be available at http://localhost:8288.
6

Start the Next.js dev server

In another terminal, start the main backend:
npm run dev
The backend is now running at http://localhost:3000.

Build your first app

Once the backend is running and the mobile app is installed on your device or simulator:
1

Open the Create tab

In the mobile app, tap the Create tab at the bottom of the screen. This opens VibraCreateAppScreen.
2

Describe your app

Type (or tap the microphone to speak) a description of the app you want to build. Be as specific or as brief as you like. For example:
“A habit tracker with a daily checklist and a streak counter”
3

Watch it build

Vibra Code creates a session in Convex, spawns an E2B sandbox, and starts the AI agent. You will see status updates stream in real time:Cloning repoInstalling dependenciesStarting dev serverCreating tunnelRunningThe chat view shows every file the agent reads, edits, and runs as it works.
4

Preview the app

Once the tunnel is ready, the app preview loads directly on your device. Tap the preview to interact with your new app. Tap the chat area to send follow-up instructions.
The first build takes longer because the sandbox clones the Expo template and installs npm dependencies from scratch. Subsequent messages in the same session reuse the running sandbox and are much faster.

Build docs developers (and LLMs) love