# How to create a contentful asset on Vercel

**Author:** Ismael Rumzan

---

## How to Add an MCP **Server** to an Express API

Make your Express API accessible to AI assistants through the Model Context Protocol.

## Introduction

Your Express API holds valuable data. AI assistants like Claude or Cursor can't access it directly. The Model Context Protocol (MCP) solves this problem by exposing your API as tools that AI models can discover and use.

This guide shows you how to add MCP to Express without rewriting your code. MCP tools will call your existing endpoints internally. Your API structure stays the same. The setup deploys to Vercel as serverless functions.

* * *

Testing dividers

* * *

## Hello world

## What You'll Build

You will:

- Create an Express API using Vercel's CLI
  
- Add a weather endpoint
  
- Build an MCP server with four specialized tools
  
- Test with the MCP Inspector
  
- Connect to Cursor IDE
  

Topics covered:

- Initialize Express with `vc init`
  
- Build REST endpoints
  
- Add MCP with `mcp-handler`
  
- Convert Express req/res to Web API format
  
- Test MCP tools
  
- Deploy to Vercel
  

## 1\. Initialize an Express Project

Create a new Express project with Vercel's CLI:

`vc init express express-mcp-weather`

## 2\. Build the Weather API Endpoint

Replace `src/index.ts` with a weather endpoint:

``import express from 'express'; const app = express(); const PORT = process.env.PORT || 3001; app.use(express.json()); // Weather API endpoint app.get('/api/weather/:city', async (req, res) => { try { const city = req.params.city; const units = req.query.units as string | undefined; const normalizedUnits = units === 'imperial' ? 'imperial' : 'metric'; // Step 1: Geocode city to get coordinates const geoParams = new URLSearchParams({ name: city, count: '1', language: 'en', format: 'json' }); const geoResponse = await fetch( `https://geocoding-api.open-meteo.com/v1/search?${geoParams}` ); if (!geoResponse.ok) { return res.status(geoResponse.status).json({ error: 'Failed to fetch geocoding data' }); } const geoData = await geoResponse.json(); if (!geoData.results || geoData.results.length === 0) { return res.status(404).json({ error: `City '${city}' not found` }); } const location = geoData.results[0]; const { name, country, latitude, longitude } = location; // Step 2: Fetch current weather data const weatherParams: Record<string, string> = { latitude: latitude.toString(), longitude: longitude.toString(), current: 'temperature_2m,relative_humidity_2m,apparent_temperature,wind_speed_10m', timezone: 'auto' }; if (units === 'imperial') { weatherParams.temperature_unit = 'fahrenheit'; weatherParams.wind_speed_unit = 'mph'; } const weatherUrlParams = new URLSearchParams(weatherParams); const weatherResponse = await fetch( `https://api.open-meteo.com/v1/forecast?${weatherUrlParams}` ); if (!weatherResponse.ok) { return res.status(weatherResponse.status).json({ error: 'Failed to fetch weather data' }); } const weatherData = await weatherResponse.json(); res.json({ city: name, country, latitude, longitude, units: normalizedUnits, current: weatherData.current }); } catch (error) { console.error('Weather API error:', error); res.status(500).json({ error: 'Failed to fetch weather data', message: error instanceof Error ? error.message : 'Unknown error' }); } }); export default app;`` ## API Reference **📊 Table:** - **Parameter** | Description | Next.js | Other Frameworks    - **request** | An instance of the Request object | NextRequest | Request    - **context** | Deprecated, use @vercel/functions instead | N/A | waitUntil    `export function GET(request: Request) { return new Response('Hello from Vercel!'); }` `export function GET(request: Request) { return new Response('Hello from Vercel!'); }` ## Conclusion You added MCP capabilities to Express. Your server has two interfaces: a REST API and an MCP server for AI assistants. Both share the same business logic. Key patterns: - MCP tools wrap existing endpoints    - Adapters bridge Express and Web APIs    - Zod schemas provide validation and documentation    - MCP error format helps AI assistants recover    - MCP Inspector speeds development    ## Next steps - Add tools for more endpoints    - Implement OAuth authentication    - Create tools that combine API calls    - Explore the [MCP specification](https://modelcontextprotocol.io/)
  

### Resources

- [Vercel MCP documentation](https://vercel.com/docs/mcp)
  
- [mcp-handler on npm](https://www.npmjs.com/package/mcp-handler)
  
- [MCP Inspector](https://github.com/modelcontextprotocol/inspector)
  
- [Express on Vercel](https://vercel.com/guides/using-express-with-vercel)

---

[View full KB sitemap](/kb/sitemap.md)