Noureddine RAMDI / Vibra Code: An open-source AI app builder with cloud sandboxes and native 60fps chat UI

Created Mon, 04 May 2026 10:23:01 +0000 Modified Sat, 23 May 2026 20:41:27 +0000

sa4hnd/vibra-code

Vibra Code takes a distinctive approach to AI-powered mobile app building by running Claude Code CLI within isolated E2B cloud sandboxes, orchestrated by Inngest, while streaming real-time code updates back to a native iOS chat UI built with Texture and IGListKit. This architecture enables a smooth, 60fps off-main-thread user experience uncommon in AI code generation tools, all wrapped in an open-source and self-hostable package.

What vibra code does and its architecture

At its core, Vibra Code is an AI app builder designed for mobile platforms where users describe apps in plain English, and the system generates them using Claude Code. The backend runs Claude Code CLI commands inside E2B cloud sandboxes, which are isolated, ephemeral environments ensuring safety and reproducibility.

The tech stack includes Next.js 15 for the frontend and backend server, Convex for real-time data synchronization, and Inngest to orchestrate background jobs such as invoking the AI code generation processes. This combination provides a responsive, real-time interface where code generation progress and results can be streamed live.

On the mobile side, Vibra Code uses a modified Expo Go app to preview generated native iOS apps. The chat UI, where users interact with the AI, is implemented natively using Texture (formerly AsyncDisplayKit) combined with IGListKit. This setup allows rendering at a smooth 60fps off the main thread, preventing UI jank and improving user experience.

The system supports multiple AI providers, including Claude, Cursor, and Gemini, offering flexibility in choice or fallback options. It also integrates voice and image inputs, GitHub for code management, and supports both web and mobile previews seamlessly.

Technical strengths and tradeoffs

One standout technical strength is the use of E2B cloud sandboxes to run Claude Code CLI commands. This isolation ensures that AI code generation processes are sandboxed, improving security and consistency. Orchestrating these jobs through Inngest adds reliability and scalability, allowing potentially complex workflows to be handled asynchronously.

The real-time synchronization via Convex is another key feature. Convex acts as a real-time backend database that syncs state changes immediately to clients, which is critical for streaming code generation results back to the UI in a live manner.

The native iOS chat UI built with Texture and IGListKit is particularly noteworthy. Texture is known for high-performance asynchronous UI rendering, and IGListKit helps manage data-driven collection views efficiently. Together, they deliver a 60fps off-main-thread experience, which is rare for chat interfaces that often suffer from jank due to heavy UI updates on the main thread.

Supporting multiple AI providers is a plus, giving the project flexibility and resilience against API changes or downtime. The inclusion of voice and image inputs broadens the interaction modes beyond just text.

However, there are tradeoffs. Running all these components—Next.js backend, Convex real-time database, Inngest job orchestration, E2B sandboxes, and a native iOS UI—adds complexity and operational overhead. As a single developer project, maintaining and evolving this stack could be challenging. The reliance on several third-party services (Convex, Inngest, E2B, AI providers) means the full self-hosted experience depends on external platforms with their own limits and pricing.

Still, the codebase appears surprisingly clean and well-organized for a solo effort, with clear separation of concerns and modern stack choices.

Quick start

If you want to try Vibra Code, the README provides a clear set of installation steps and prerequisites.

First, you need API keys for Anthropics (Claude), E2B cloud sandboxes, Clerk for authentication, and a Convex deployment URL. Stripe and RevenueCat keys are optional for payment support.

The backend setup involves installing dependencies, configuring environment variables, deploying the Convex database, starting the Inngest job server, and running the Next.js app:

cd vibracode-backend
npm install
cp .env.example .env.local    # then add your API keys

npx convex deploy              # deploy database
npx inngest-cli@latest dev     # job server → localhost:8288
npm run dev                    # Next.js → localhost:3000

Next, you build the E2B sandbox template:

npm install -g @e2b/cli && e2b auth login
cd vibracode-backend/e2b-cursor-template
e2b template build

This prepares the isolated environment where Claude Code runs.

verdict

Vibra Code is a technically interesting AI app builder that combines isolated cloud sandbox execution, real-time sync, and a high-performance native iOS UI. It’s a solid example of orchestrating complex AI workflows with modern tools like Next.js, Convex, Inngest, and Texture.

Its complexity and reliance on multiple third-party platforms mean it’s most relevant for developers or teams exploring AI-assisted app generation or building sophisticated real-time native mobile experiences. For those looking for an open-source alternative to commercial AI app builders, Vibra Code offers a transparent and extensible base.

The tradeoff is clear: running and maintaining this stack requires some infrastructure familiarity and willingness to manage multiple moving parts. But if you want to explore AI code generation in a sandboxed, real-time environment with a polished native UI, Vibra Code is worth a look.


→ GitHub Repo: sa4hnd/vibra-code ⭐ 71 · TypeScript