Vaadin MCP Server

🚀 Vaadin MCP Server

The Vaadin Model Context Protocol (MCP) server provides AI coding assistants with direct access to comprehensive Vaadin documentation, enabling intelligent code assistance for Vaadin Java and React applications.

🔧 Transport Types

Important: The Vaadin MCP server uses HTTP transport (streamable-http). This is natively supported by Claude Code, Cursor, and Windsurf. For stdio-only tools like Junie, you can use @pyroprompts/mcp-stdio-to-streamable-http-adapter as a bridge between the two transport types.

✨ What's Included

• Semantic search across Vaadin documentation

• Full document retrieval for complete context

• Component version information and API references

• Component-specific API documentation (Java, React, Web Components)

• Component styling and theming information

• Support for both Java and React applications

• Current Vaadin version information

• Vaadin development primer with best practices

🔗 Resources

Feedback:

https://vaadin.com/forum

Share feedback, report issues, and ask questions on the Vaadin forum.

Vaadin Documentation:

https://vaadin.com/docs

Browse the full Vaadin documentation.

Model Context Protocol:

https://modelcontextprotocol.io

Learn more about the Model Context Protocol standard.

⚡ Setup Instructions

Click on your AI coding tool to expand setup instructions:

Claude Code

HTTP

Native HTTP support ›

Add the Vaadin MCP server using the CLI or manual configuration.

Option 1: CLI Command (Recommended)

CopyRun in terminal:

claude mcp add vaadin --transport http https://mcp.vaadin.com/docs

Option 2: Manual Configuration

CopyConfiguration:

{ "mcpServers": { "vaadin": { "type": "http", "url": "https://mcp.vaadin.com/docs" } } }

File locations:

• Project-scoped: .mcp.json (in project root)

• Global: ~/.claude.json

Note: Restart Claude Code after making configuration changes.

Cursor

HTTP

Add the Vaadin MCP server to your project or global configuration.

• Project-scoped: .cursor/mcp.json

• Global: ~/.cursor/mcp.json

Note: Restart Cursor after making configuration changes.

Windsurf

HTTP

Add the Vaadin MCP server through Windsurf Settings (bottom right) or Cmd+Shift+P → "Open Windsurf Settings".

CopyConfiguration (~/.codeium/windsurf/mcp_config.json):

Note: Click the Hammer icon on the Cascade toolbar to view connected MCP tools.

Junie (JetBrains IDEs)

via proxy

Requires HTTP adapter ›

Junie only supports stdio-based MCP servers. Use @pyroprompts/mcp-stdio-to-streamable-http-adapter to bridge stdio to the HTTP-based Vaadin MCP server.

• Open IDE settings: Ctrl+Alt+S (Windows/Linux) or Cmd+, (macOS)

• Navigate to Tools → Junie → MCP Settings

• Click the Add button and add the configuration below

{ "mcpServers": { "vaadin": { "command": "npx", "args": ["@pyroprompts/mcp-stdio-to-streamable-http-adapter"], "env": { "URI": "https://mcp.vaadin.com/docs", "MCP_NAME": "vaadin" } } } }

Note: The adapter uses environment variables to configure the connection. URI points to the Vaadin MCP server endpoint, and MCP_NAME is an identifier for the server.

• Project-scoped: .junie/mcp/mcp.json

• Global: ~/.junie/mcp.json

GitHub Copilot (JetBrains IDEs)

HTTP

Agent mode required (Public Preview) ›

⚠️ Important: MCP servers only work when GitHub Copilot is used in Agent mode. Regular Copilot Chat does not support MCP.

Agent mode with MCP support is now in public preview for JetBrains IDEs (as of May 2025).

• Create .copilot/mcp-config.json in your project root (JetBrains IDEs use the same format as VS Code)

• Add the configuration below

• Switch to Agent mode: Click the GitHub Copilot icon → Change to Agent mode

• Configure MCP servers: Click Tools icon → Add More Tools → Edit mcp.json

• Alternative: Click GitHub Copilot icon → Edit settings → MCP Servers section

CopyConfiguration (.copilot/mcp-config.json):

{ "servers": { "vaadin": { "url": "https://mcp.vaadin.com/docs" } } }

Known Issue: Some users report that tools may not appear if MCP servers are configured after the IDE has started. For best results, create the mcp-config.json file before starting your IDE.

Enterprise Note: Organizations with Copilot Business or Enterprise must enable the "MCP servers in Copilot" policy (disabled by default).

Learn more:

• GitHub Copilot MCP Guide

• JetBrains MCP Announcement

GitHub Copilot (VS Code)

HTTP

Agent mode required (VS Code 1.99+) ›

Requires VS Code 1.99 or later.

• Create .vscode/mcp.json in your project root

• Add the configuration below

• Click the Start button that appears at the top of the MCP servers list

• Switch to Agent mode: Open Copilot Chat → Click mode selector → Select "Agent"

• Click the tools icon in Agent mode to view available MCP servers

CopyConfiguration (.vscode/mcp.json):

{ "servers": { "vaadin": { "type": "http", "url": "https://mcp.vaadin.com/docs" } } }

Learn more:

• VS Code MCP Documentation

• GitHub Copilot MCP Guide

Codex (OpenAI)

HTTP

Add the Vaadin MCP server to your Codex configuration. Works with both Codex CLI and IDE extension.

• Open or create ~/.codex/config.toml

• Add the server configuration below

• Restart Codex to load the new MCP server

CopyConfiguration (~/.codex/config.toml):

[mcp_servers.vaadin] url = "https://mcp.vaadin.com/docs"

Version Requirement: HTTP-based MCP servers require Codex CLI version 0.43 or later. If you see "missing field command" errors, upgrade with: npm install -g @openai/codex@latest

Learn more:

• Codex MCP Documentation

• Codex GitHub Repository

Gemini CLI (Google)

HTTP

Add the Vaadin MCP server to your Gemini CLI configuration. Gemini will automatically use Vaadin documentation tools when relevant.

• Open or create ~/.gemini/settings.json

• Add the server configuration below

• Restart Gemini CLI to load the new MCP server

CopyConfiguration (~/.gemini/settings.json):

{ "mcpServers": { "vaadin": { "httpUrl": "https://mcp.vaadin.com/docs" } } }

Note: Gemini CLI will automatically invoke Vaadin tools when you ask questions about Vaadin development (e.g., "What is a TestBench UI unit test?").

Learn more:

• Gemini CLI GitHub Repository

• Gemini CLI MCP Documentation

Opencode

HTTP

Add the Vaadin MCP server to your Opencode configuration.

• Open or create opencode.json in your project root

• Add the server configuration below

• Restart Opencode to load the new MCP server

CopyConfiguration (opencode.json):

{ "$schema": "https://opencode.ai/config.json", "mcp": { "vaadin": { "type": "remote", "url": "https://mcp.vaadin.com/docs", "enabled": true } } }

Learn more:

• Opencode MCP Documentation

Other MCP Clients

HTTP or stdio

Check your tool's docs ›

The Vaadin MCP server can be used with any MCP-compatible client. Choose the appropriate configuration based on your tool's transport support:

If your tool supports HTTP/SSE natively:

Simply point it to our HTTP endpoint:

HTTP Endpoint:

https://mcp.vaadin.com/docs

The exact configuration format depends on your specific tool. Look for settings like "MCP Server URL", "HTTP transport", or "Streamable HTTP" in your tool's documentation.

If your tool only supports stdio:

Use an HTTP adapter to bridge stdio to HTTP. This works with any stdio-based MCP client:

Generic stdio configuration:

Adapt the JSON structure to match your tool's configuration format. The adapter uses environment variables: URI for the server endpoint and MCP_NAME as an identifier.