SkillAgentSearch skills...

Vibesdk

An open-source vibe coding platform that helps you build your own vibe-coding platform, built entirely on Cloudflare stack

Install / Use

/learn @cloudflare/Vibesdk
About this skill

Quality Score

0/100

Supported Platforms

Universal

README

🧡 Cloudflare Vibe SDK

An open source full-stack AI webapp generator – Deploy your own instance of Cloudflare VibeSDK, an AI vibe coding platform that you can run and customize yourself.

<div align="center">

🚀 Live Demo

build.cloudflare.dev

Explore VibeSDK Build before deploying your own stack.

Deploy to Cloudflare Workers

👆 Click to deploy your own instance!

Follow the setup guide below to configure required services

</div>

Star History

Star History Chart


✨ What is Cloudflare VibeSDK?

Cloudflare VibeSDK is an open source AI vibe coding platform built on Cloudflare's developer platform. If you're building an AI-powered platform for building applications, this is a great example that you can deploy and customize to build the whole platform yourself. Once the platform is deployed, users can say what they want to build in natural language, and the AI agent will create and deploy the application.

🌐 Experience it live at build.cloudflare.dev – Try it out before deploying your own instance!

🎯 Perfect For

Companies building AI-powered platforms

Run your own solution that allows users to build applications in natural language. Customize the AI behavior, control the generated code patterns, integrate your own component libraries, and keep all customer data within your infrastructure. Perfect for startups wanting to enter the AI development space or established companies adding AI capabilities to their existing developer tools.

Internal development

Enable non-technical teams to create the tools they need without waiting for engineering resources. Marketing can build landing pages, sales can create custom dashboards, and operations can automate workflows, all by describing what they want.

SaaS platforms

Let your customers extend your product's functionality without learning your API or writing code. They can describe custom integrations, build specialized workflows, or create tailored interfaces specific to their business needs.


🎯 Key Features

🤖 AI Code Generation – Phase-wise development with intelligent error correction
Live Previews – App previews running in sandboxed containers
💬 Interactive Chat – Guide development through natural conversation
📱 Modern Stack – Generates React + TypeScript + Tailwind apps
🚀 One-Click Deploy – Deploy generated apps to Workers for Platforms
📦 GitHub Integration – Export code directly to your repositories

🏗️ Built on Cloudflare's Platform

Cloudflare VibeSDK Build utilizes the full Cloudflare developer ecosystem:

  • Frontend: React + Vite with modern UI components
  • Backend: Workers with Durable Objects for AI agents
  • Database: D1 (SQLite) with Drizzle ORM
  • AI: Multiple LLM providers via AI Gateway
  • Containers: Sandboxed app previews and execution
  • Storage: R2 buckets for templates, KV for sessions
  • Deployment: Workers for Platforms with dispatch namespaces

SDK for Programmatic Access

Build apps programmatically using the official TypeScript SDK:

npm install @cf-vibesdk/sdk
import { PhasicClient } from '@cf-vibesdk/sdk';

const client = new PhasicClient({
  baseUrl: 'https://build.cloudflare.dev',
  apiKey: process.env.VIBESDK_API_KEY!,
});

const session = await client.build('Build a simple hello world page.', {
  projectType: 'app',
  autoGenerate: true,
});

await session.wait.deployable();
console.log('Preview URL:', session.state.previewUrl);
session.close();

SDK Documentation - Full API reference and examples

📋 Quick Deploy Checklist

Before clicking "Deploy to Cloudflare", have these ready:

✅ Prerequisites

  • Cloudflare Workers Paid Plan
  • Workers for Platforms subscription
  • Advanced Certificate Manager (needed when you map a first-level subdomain such as abc.xyz.com so Cloudflare can issue the required wildcard certificate for preview apps on *.abc.xyz.com)

🔑 Required API Key

Once you click "Deploy to Cloudflare", you'll be taken to your Cloudflare dashboard where you can configure your VibeSDK deployment with these variables.

Deploy to Cloudflare Workers

🔑 What you'll configure

  • GOOGLE_AI_STUDIO_API_KEY - Your Google Gemini API key for Gemini models
  • JWT_SECRET - Secure random string for session management
  • WEBHOOK_SECRET - Webhook authentication secret
  • SECRETS_ENCRYPTION_KEY - Encryption key for secrets
  • SANDBOX_INSTANCE_TYPE - Container performance tier (optional, see section below)
  • ALLOWED_EMAIL - Email address of the user allowed to use the app. This is used to verify the user's identity and prevent unauthorized access.
  • CUSTOM_DOMAIN - Custom domain for your app that you have configured in Cloudflare (Required). If you use a first-level subdomain such as abc.xyz.com, make sure the Advanced Certificate Manager add-on is active on that zone.

Custom domain DNS setup

To serve preview apps correctly, add the following DNS record in the zone that hosts CUSTOM_DOMAIN:

  • Type: CNAME
  • Name: *.abc
  • Target: abc.xyz.com (replace with your base custom domain or another appropriate origin)
  • Proxy status: Proxied (orange cloud)

Adjust the placeholder abc/xyz parts to match your domain. DNS propagation can take time—expect it to take up to an hour before previews resolve. This step may be automated in a future release, but it is required today.

🏗️ Sandbox Instance Configuration (Optional)

VibeSDK uses Cloudflare Containers to run generated applications in isolated environments. You can configure the container performance tier based on your needs and Cloudflare plan.

Available Instance Types

📢 Updated Oct 2025: Cloudflare now offers larger container instance types with more resources!

| Instance Type | Memory | CPU | Disk | Use Case | Availability | |---------------|--------|-----|------|----------|--------------| | lite (alias: dev) | 256 MiB | 1/16 vCPU | 2 GB | Development/testing | All plans | | standard-1 (alias: standard) | 4 GiB | 1/2 vCPU | 8 GB | Light production apps | All plans | | standard-2 | 8 GiB | 1 vCPU | 12 GB | Medium workloads | All plans | | standard-3 | 12 GiB | 2 vCPU | 16 GB | Production apps | All plans (Default) | | standard-4 | 12 GiB | 4 vCPU | 20 GB | High-performance apps | All plans |

Configuration Options

Option A: Via Deploy Button (Recommended) During the "Deploy to Cloudflare" flow, you can set the instance type as a build variable:

  • Variable name: SANDBOX_INSTANCE_TYPE
  • Recommended values:
    • Standard/Paid users: standard-3 (default, best balance)
    • High-performance needs: standard-4

Option B: Via Environment Variable For local deployment or CI/CD, set the environment variable:

export SANDBOX_INSTANCE_TYPE=standard-3  # or standard-4, standard-2, standard-1, lite
bun run deploy

Instance Type Selection Guide

For All Users:

  • standard-3 (Recommended) - Best balance for production apps with 2 vCPU and 12 GiB memory
  • standard-4 - Maximum performance with 4 vCPU for compute-intensive applications

What This Affects

The SANDBOX_INSTANCE_TYPE controls:

  • App Preview Performance - How fast generated applications run during development
  • Build Process Speed - Container compile and build times
  • Concurrent App Capacity - How many apps can run simultaneously
  • Resource Availability - Memory and disk space for complex applications

💡 Pro Tip: Start with standard-3 (the new default) for the best balance of performance and resources. Upgrade to standard-4 if you need maximum CPU performance for compute-intensive applications.

🔗 Post-Deployment: OAuth Setup (Optional)

OAuth configuration is not shown on the initial deploy page. If you want user login features, you'll need to set this up after deployment:

How to Add OAuth After Deployment:

  1. Find your repository in your GitHub/GitLab account (created by "Deploy to Cloudflare" flow)
  2. Clone locally and run bun install
  3. Create .dev.vars and .prod.vars files (see below for OAuth configuration)
  4. Run bun run deploy to update your deployment

Google OAuth Setup:

  1. Google Cloud Console → Create Project
  2. Enable Google+ API
  3. Create OAuth 2.0 Client ID
  4. Add authorized origins: https://your-custom-domain.
  5. Add redirect URI: https://your-worker-name.workers.dev/api/auth/callback/google
  6. Add to both .dev.vars (for local development) and .prod.vars (for deployment):
    GOOGLE_CLIENT_ID="your-google-client-id"
    GOOGLE_CLIENT_SECRET="your-google-client-secret"
    

GitHub OAuth Setup:

  1. GitHub → SettingsDeveloper settingsOAuth Apps
  2. Click New OAuth App
  3. Application name: Cloudflare VibeSDK
  4. Homepage URL: https://your-worker-name.workers.dev
  5. Authorization callback URL: https://your-worker-name.workers.dev/api/auth/callback/github
  6. Add to both .dev.vars (for local development) and .prod.vars (for deployment):
    GITHUB_CLIENT_ID="your-github-client-id"
    GITHUB_CLIENT_SECRET="your-github-client-secret"
    

GitHub Export OAuth Setup:

  1. Create a separate GitHub OAu
View on GitHub
GitHub Stars4.9k
CategoryDevelopment
Updated5h ago
Forks1.2k

Languages

TypeScript

Security Score

100/100

Audited on Mar 21, 2026

No findings