Claudable is a powerful Next.js-based web app builder that combines Claude Code's (Cursor CLI also supported!) advanced AI agent capabilities with Lovable's simple and intuitive app building experience. Just describe your app idea - "I want a task management app with dark mode" - and watch as Claudable instantly generates the code and shows you a live preview of your working app. You can deploy your app to Vercel and integrate database with Supabase for free.

This open-source project empowers you to build and deploy professional web applications easily for free.

How to start? Simply login to Claude Code (or Cursor CLI), start Claudable, and describe what you want to build. That's it. There is no additional subscription cost for app builder.

• Powerful Agent Performance: Leverage the full power of Claude Code and Cursor CLI Agent capabilities with native MCP support
• Natural Language to Code: Simply describe what you want to build, and Claudable generates production-ready Next.js code
• Instant Preview: See your changes immediately with hot-reload as AI builds your app
• Zero Setup, Instant Launch: No complex sandboxes, no API key, no database headaches - just start building immediately
• Beautiful UI: Generate beautiful UI with Tailwind CSS and shadcn/ui
• Deploy to Vercel: Push your app live with a single click, no configuration needed
• GitHub Integration: Automatic version control and continuous deployment setup
• Supabase Database: Connect production PostgreSQL with authentication ready to use
• Automated Error Detection: Detect errors in your app and fix them automatically

AI Cooding Agent:

• Claude Code: Advanced AI coding agent. We strongly recommend you to use Claude Code for the best experience.

  # Install npm install -g @anthropic-ai/claude-code # Login claude # then > /login

• Cursor CLI: Intelligent coding agent for complex coding tasks. It's little bit slower than Claude Code, but it's more powerful.

  # Install curl https://cursor.com/install -fsS | bash # Login cursor-agent login

Database & Deployment:

• Supabase: Connect production-ready PostgreSQL database directly to your project.
• Vercel: Publish your work immediately with one-click deployment

There is no additional subscription cost and built just for YOU.

Before you begin, ensure you have the following installed:

• Node.js 18+
• Python 3.10+
• Claude Code or Cursor CLI (already logged in)
• Git

Get Claudable running on your local machine in minutes:

# Clone the repository git clone https://github.com/opactorai/Claudable.git cd Claudable # Install all dependencies (Node.js and Python) npm install # Start development servers npm run dev

Your application will be available at:

• Frontend: http://localhost:3000
• API Server: http://localhost:8080
• API Documentation: http://localhost:8080/docs

Note: Ports are automatically detected. If the default ports are in use, the next available ports will be assigned.

macOS Users: Download the ready-to-use desktop app directly!

• Apple Silicon (M1/M2/M3): Download Claudable-0.1.0-arm64.dmg (292MB)
• Intel Mac: Download Claudable-0.1.0.dmg (297MB)

Installation:

1. Download the DMG file for your Mac type
2. Open the DMG file
3. Drag Claudable to your Applications folder
4. Launch Claudable from Applications or Launchpad

Build and distribute a desktop app that bundles the web UI and runs the local API automatically.

# Build production Next.js and package Electron app npm run build:desktop # Output installers # - macOS: apps/desktop/dist/*.dmg # - Windows: apps/desktop/dist/*.exe # - Linux: apps/desktop/dist/*.AppImage

Notes:

• First launch will set up a Python virtual environment in your user data folder and install API dependencies (internet required). Subsequent launches are fast and offline.
• The desktop app serves the UI at http://localhost:8080 and proxies /api/* to the local Python API.
• If port 8080 is in use, close the conflicting app before launching the desktop app.

You can also manually setup the project.

# Frontend setup cd apps/web npm install # Backend setup cd ../api python3 -m venv .venv source .venv/bin/activate # On Windows: .venv\Scripts\activate pip install -r requirements.txt

The npm install command automatically handles the complete setup:

1. Port Configuration: Detects available ports and creates .env files
2. Node.js Dependencies: Installs packages including workspace dependencies
3. Python Environment: Creates virtual environment in apps/api/.venv
4. Python Dependencies: Installs packages using uv (if available) or pip
5. Database Setup: SQLite database auto-creates at data/cc.db on first run

npm run db:backup # Create a backup of your SQLite database # Use when: Before major changes or deployments # Creates: data/backups/cc_backup_[timestamp].db npm run db:reset # Reset database to initial state # Use when: Need fresh start or corrupted data # Warning: This will delete all your data! npm run clean # Remove all dependencies and virtual environments # Use when: Dependencies conflict or need fresh install # Removes: node_modules/, apps/api/.venv/, package-lock.json # After running: npm install to reinstall everything

1. Connect Claude Code: Link your Claude Code CLI to enable AI assistance
2. Describe Your Project: Use natural language to describe what you want to build
3. AI Generation: Watch as the AI generates your project structure and code
4. Live Preview: See changes instantly with hot reload functionality
5. Deploy: Push to production with Vercel integration

Access the interactive API documentation at http://localhost:8080/docs to explore available endpoints and test API functionality.

Claudable uses SQLite for local development and can be configured for PostgreSQL in production. The database automatically initializes on first run.

The application automatically finds available ports. Check the .env file to see which ports were assigned.

# Clean all dependencies and retry npm run clean npm install

If you encounter permission errors:

cd apps/api python3 -m venv .venv source .venv/bin/activate pip install -r requirements.txt

If you encounter the error: Error output dangerously skip permissions cannot be used which is root sudo privileges for security reasons

Solution:

1. Do not run Claude Code with sudo or as root user
2. Ensure proper file ownership in WSL:

   # Check current user whoami # Change ownership of project directory to current user sudo chown -R $(whoami):$(whoami) ~/Claudable

3. If using WSL, make sure you're running Claude Code from your user account, not root
4. Verify Claude Code installation permissions:

   # Reinstall Claude Code without sudo npm install -g @anthropic-ai/claude-code --unsafe-perm=false

Get Token: GitHub Personal Access Tokens → Generate new token (classic) → Select repo scope

Connect: Settings → Service Integrations → GitHub → Enter token → Create or connect repository

Get Token: Vercel Account Settings → Create Token

Connect: Settings → Service Integrations → Vercel → Enter token → Create new project for deployment

Get Credentials: Supabase Dashboard → Your Project → Settings → API

• Project URL: https://xxxxx.supabase.co
• Anon Key: Public key for client-side
• Service Role Key: Secret key for server-side

Same prompt, different results

View Claudable Live Demo →

View Lovable Live Demo →

MIT License.

These features are in development and will be opened soon.

• New CLI Agents - Trust us, you're going to LOVE this!
• Checkpoints for Chat - Save and restore conversation/codebase states
• Advanced MCP Integration - Native integration with MCP
• Enhanced Agent System - Subagents, AGENTS.md integration
• Website Cloning - You can start a project from a reference URL.
• Various bug fixes and community PR merges

We're working hard to deliver the features you've been asking for. Stay tuned!