What is V0 Mcp Ts

v0-mcp-ts is a custom Model Context Protocol (MCP) implementation designed to enhance AI models’ capabilities by providing real-time context and enabling actions through Node.js and TypeScript.

Use cases

Use cases include generating full-stack applications, enhancing existing codebases with AI, debugging problematic code snippets, and creating reusable, type-safe components for various frameworks.

How to use

To use v0-mcp-ts, you can utilize the command-line tool ‘mcp-tool’ to generate web applications, enhance existing code, debug issues, and create reusable components by running specific commands with appropriate prompts.

Key features

Key features include complete web app generation, intelligent code enhancement, smart debugging, component generation, lightning-fast performance powered by Bun, MCP compatibility, type safety with TypeScript, and a comprehensive test suite.

Where to use

v0-mcp-ts can be used in modern web development environments, particularly for projects that require AI integration, such as e-commerce platforms, web applications, and software development tools.

v0-mcp-ts

🚀 A powerful Model Context Protocol (MCP) server that integrates v0.dev AI capabilities for modern web development

Transform your development workflow with AI-powered web application generation, code enhancement, debugging, and component creation through the standardized MCP protocol. Now powered by Bun for 25x faster performance! ⚡

✨ Features

• 🎯 Complete Web App Generation - Create full-stack applications with Next.js, React, Vue, Svelte
• 🔧 Intelligent Code Enhancement - AI-powered code improvements and optimizations
• 🐛 Smart Debugging - Automated error detection and fixes
• 🧩 Component Generation - Create reusable, type-safe components
• ⚡ Lightning Fast - Powered by Bun runtime (25x faster than npm)
• 🔗 MCP Compatible - Works with any MCP client (Claude Desktop, Cursor, etc.)
• 🛡️ Type-Safe - Full TypeScript support with Zod validation
• 🧪 Well Tested - Comprehensive test suite with Vitest and coverage

🎬 Quick Demo

# Generate a complete Next.js e-commerce app
mcp-tool generate_webapp --prompt "E-commerce store with shopping cart" --framework nextjs

# Enhance existing code with AI
mcp-tool enhance_code --code "function add(a,b){return a+b}" --enhancement "Add TypeScript types"

# Debug problematic code
mcp-tool debug_code --code "broken code here" --error_message "TypeError: Cannot read property"

# Create reusable components
mcp-tool generate_component --name "UserCard" --description "Profile card component"

📋 Prerequisites

• Bun 1.2.0 or higher (for best performance)
• v0.dev API Key (Premium or Team plan required)
• TypeScript 5.0+
• MCP Client (Claude Desktop, Cursor, etc.)

⚡ Install Bun (if not already installed)

# macOS and Linux
curl -fsSL https://bun.sh/install | bash

# Windows (PowerShell)
powershell -c "irm bun.sh/install.ps1 | iex"

# Or with npm (if you have Node.js)
npm install -g bun

🚀 Quick Start

1. Installation

git clone https://github.com/nicotordev/v0-mcp-ts.git
cd v0-mcp-ts
bun install  # ⚡ 25x faster than npm install

2. Setup

bun run setup

This interactive setup will:

• Configure your v0.dev API key
• Build the project with Bun
• Run tests with coverage
• Generate MCP client configuration

3. Configuration

For Claude Desktop

Copy the generated configuration to your Claude Desktop config:

{
  "mcpServers": {
    "v0-mcp-ts": {
      "command": "node",
      "args": [
        "/absolute/path/to/v0-mcp-ts/dist/index.js"
      ],
      "env": {
        "V0_API_KEY": "your_v0_api_key_here"
      }
    }
  }
}

For Other MCP Clients

The server uses standard stdio transport, making it compatible with any MCP client.

🤖 AI Editor Integration

Get started quickly with these optimized configurations for AI-powered code editors:

• Cursor AI Configuration - Complete setup with YOLO mode and test-driven development
• Windsurf IDE Configuration - Advanced workflows with Cascade and Flow features

📖 Full Editor Setup Guide

🛠️ Available Tools

generate_webapp

Create complete web applications with AI assistance.

Parameters:

• prompt (string) - Description of the application to generate
• framework (optional) - Target framework: nextjs, react, vue, svelte
• features (optional) - Array of required features
• stream (optional) - Enable streaming responses

Example:

{
  "name": "generate_webapp",
  "arguments": {
    "prompt": "Real-time chat application with authentication",
    "framework": "nextjs",
    "features": [
      "authentication",
      "database",
      "websockets"
    ],
    "stream": false
  }
}

enhance_code

Improve existing code with AI-powered suggestions.

Parameters:

• code (string) - Code to enhance
• enhancement (string) - Description of desired improvements
• language (optional) - Programming language (default: typescript)

debug_code

Debug and fix code issues automatically.

Parameters:

• code (string) - Code with issues
• error_message (optional) - Error message if available
• language (optional) - Programming language (default: typescript)

generate_component

Create reusable components with proper TypeScript types.

Parameters:

• component_name (string) - Name of the component
• description (string) - Component functionality description
• framework (optional) - Component framework: react, vue, svelte
• props (optional) - Component props specification

📚 Resources

v0-api-docs

Access comprehensive v0.dev API documentation and best practices.

URI: v0://api-docs

💡 Prompts

create-webapp

Predefined template for generating web applications with specific requirements.

🧪 Development

Running Tests

# Run all tests (with Bun's fast test runner)
bun test

# Run tests in watch mode
bun run test:watch

# Run tests with UI
bun run test:ui

# Generate coverage report
bun run test:coverage

Development Mode

# Start development server with auto-reload
bun run dev

Building

# Build for production
bun run build

# Clean build artifacts
bun run clean

⚡ Bun Performance Benefits

By migrating to Bun, this project now enjoys significant performance improvements:

• 25x faster package installation compared to npm
• Native TypeScript support without transpilation overhead
• Built-in test runner with Jest compatibility
• Hot reload with native watch mode
• Optimized bundling and dependency resolution

Bun Commands

# Package management
bun install              # Install dependencies
bun add <package>        # Add dependency
bun remove <package>     # Remove dependency
bun update               # Update dependencies
bun audit                # Security audit (v1.2.15+)

# Development
bun run dev              # Development server
bun run build            # Build project
bun test                 # Run tests
bun --watch src/index.ts # Watch mode

# Utilities
bun upgrade              # Update Bun itself
bun --version            # Check version

🏗️ API Limits

• Daily Requests: 200 messages per day
• Context Window: 128,000 tokens
• Output Limit: 32,000 tokens
• Plan Required: v0.dev Premium or Team

🤝 Contributing

We welcome contributions! Please see our Development Guide for details.

1. Fork the repository
2. Create a feature branch: git checkout -b feature/amazing-feature
3. Make your changes and add tests
4. Ensure all tests pass: bun test
5. Commit your changes: git commit -m 'Add amazing feature'
6. Push to the branch: git push origin feature/amazing-feature
7. Open a Pull Request

📜 License

This project is licensed under the MIT License - see the LICENSE file for details.

👨‍💻 Author

Nicolas Torres

• 🌍 Location: Chile
• 🐙 GitHub: @nicotordev
• 💼 LinkedIn: nicotordev
• 🎥 YouTube: NicoTorDev Channel

Full Stack Web Developer specializing in Node.js, React.js, Next.js, Vue.js, and modern web technologies with expertise in Bun runtime optimization.

🔗 Links

• 📖 MCP Documentation
• 🎨 v0.dev API
• ⚡ Bun Documentation
• 🧠 AI SDK
• 🏗️ TypeScript MCP SDK

🌟 Show Your Support

If this project helped you, please give it a ⭐ on GitHub!

💖 Sponsor This Project

Support continued development and maintenance:

Become a sponsor on GitHub and help keep this project growing! Your support enables:

• 🚀 Continuous Development - New features and improvements
• 🐛 Bug Fixes & Maintenance - Quick responses to issues
• 📚 Documentation & Tutorials - Better learning resources
• 🤝 Community Support - Help other developers succeed

_{Built with ❤️ by Nicolas Torres in Chile 🇨🇱}