mcp-server

Name: mcp-server
Availability: InStock
Author: Webflow

The mcp-server is a Node.js server implementing the Model Context Protocol (MCP) for the Webflow Data API. This tool enables AI agents to interact with Webflow APIs. Written in TypeScript, it leverages the Webflow JavaScript SDK. The MCP server integrates seamlessly with various client applications such as Cursor, Claude Desktop, Windsurf, and VS Code, making it easy to set up and use. This allows developers to integrate Webflow functionalities into AI tools, facilitating the creation of business-critical applications.

GitHub

GitHub Stars

User Rating

Not Rated

Favorites

Views

Forks

Issues

Installation

Difficulty

Intermediate

Estimated Time

10-20 minutes

Requirements

Node.js: 18.0.0以上

npm: 8.0.0以上

+1 more

Installation

Prerequisites

Please specify required software and versions:

Node.js: 18.0.0 or higher

npm: 8.0.0 or higher

Webflow Account: Required

Installation Steps

1. Clone Repository

bash
git clone https://github.com/webflow/mcp-server.git
cd mcp-server

2. Install Dependencies

bash
npm install

3. Configure MCP Server

Edit the configuration file to add the MCP server according to the specific client application instructions.

4. Start Server

bash
npm start

Troubleshooting

Common Issues

Issue: Server won't start Solution: Check Node.js version and reinstall dependencies. Issue: Not recognized by client applications Solution: Verify configuration file path and syntax.

Configuration

Basic Configuration

Claude Desktop Setup

Edit ~/.config/claude-desktop/claude_desktop_config.json (macOS/Linux) or %APPDATA%\Claude\claude_desktop_config.json (Windows):

json
{
  "mcpServers": {
    "webflow": {
      "command": "npx",
      "args": ["mcp-remote", "https://mcp.webflow.com/sse"]
    }
  }
}

Environment Variables

Set the following environment variables as needed:

bash
export API_KEY="your-api-key"
export DEBUG="true"

Configuration Example

Basic Configuration

json
{
  "mcpServers": {
    "webflow": {
      "command": "npx",
      "args": ["mcp-remote", "https://mcp.webflow.com/sse"]
    }
  }
}

Examples

Basic Usage

Here are basic usage examples for the MCP server:

Using with Claude Desktop

1Verify MCP Server Startup

Open Claude Desktop and confirm that the configuration has been loaded correctly.

2Execute Basic Commands


   Available tools from this MCP server:
   - tool1: Description of tool1
   - tool2: Description of tool2

Programmatic Usage

javascript
// JavaScript example (Node.js)
const { MCPClient } = require('@modelcontextprotocol/client');

const client = new MCPClient();
await client.connect();

// Execute tool
const result = await client.callTool('toolName', {
  parameter1: 'value1',
  parameter2: 'value2'
});

console.log(result);

Advanced Examples

Automation Script

bash
#!/bin/bash
Batch processing example

for file in *.txt; do
  mcp-tool process "$file"
done

API Integration

python
Python example
import requests
import json

def call_mcp_tool(tool_name, params):
    response = requests.post(
        'http://localhost:3000/mcp/call',
        json={
            'tool': tool_name,
            'parameters': params
        }
    )
    return response.json()

Usage example
result = call_mcp_tool('analyze', {
    'input': 'sample data',
    'options': {'format': 'json'}
})