---
title: How to create a contentful asset on Vercel
description: This is my wonderful
url: /kb/guide/how-to-create-a-contentful-asset-on-vercel
canonical_url: "https://vercel.com/kb/guide/how-to-create-a-contentful-asset-on-vercel"
published: 2026-07-16
last_updated: 2026-07-16
authors: Ismael Rumzan
related:
  - /docs/mcp
install_vercel_plugin: npx plugins add vercel/vercel-plugin
---
<!-- docsgraph:related -->
## Related pages

> **For AI agents:** Follow these links to understand how this page connects to the rest of the Vercel ecosystem. For the full cross-link map (inbound, outbound, prerequisites, and semantic neighbors), see the .graph.md link below.

- [Deploy MCP servers to Vercel](https://vercel.com/docs/mcp/deploy-mcp-servers-to-vercel?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Learn how to deploy Model Context Protocol \\(MCP\\) servers on Vercel with OAuth authentication and efficient scaling.
- [Introducing Vercel MCP: Connect Vercel to your AI tools](https://vercel.com/blog/introducing-vercel-mcp-connect-vercel-to-your-ai-tools?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related)
- [Build an MCP Server with Weather tools using Express and Vercel](https://vercel.com/kb/guide/mcp-server-with-weather-tool-express?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Make your Express weather API accessible to AI assistants through the Model Context Protocol.
- [Building efficient MCP servers](https://vercel.com/blog/building-efficient-mcp-servers?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related)
- [Use Vercel](https://vercel.com/docs/agent-resources/vercel-mcp?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Vercel MCP has tools available for searching docs, managing teams, projects, and deployments, and querying Web Analytics
- [xmcp on Vercel](https://vercel.com/docs/frameworks/backend/xmcp?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Build MCP-compatible backends with xmcp and deploy to Vercel. Learn the project structure, tool format, middleware, and
- [Model Context Protocol (MCP) explained: An FAQ](https://vercel.com/blog/model-context-protocol-mcp-explained?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related)
- [AI SDK and MCP](https://vercel.com/docs/connect/ecosystem/ai-sdk-and-mcp?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Connect an AI SDK app to an OAuth-protected MCP server with Vercel Connect, then handle user consent and tool approval.
- [The second wave of MCP: Building for LLMs, not developers](https://vercel.com/blog/the-second-wave-of-mcp-building-for-llms-not-developers?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related)
- [Express on Vercel](https://vercel.com/docs/frameworks/backend/express?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Deploy Express applications to Vercel with zero configuration. Learn about middleware and Vercel Functions.
- [Using xmcp with Next.js](https://vercel.com/kb/guide/using-xmcp-with-nextjs?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Add an MCP server to an existing Next.js app with xmcp. Create typed tools, add authentication, and deploy to Vercel as
- [How to build an MCP server with Nuxt](https://vercel.com/kb/guide/how-to-build-an-mcp-server-with-nuxt?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=related) — Add an MCP server to your Nuxt app with the Nuxt MCP Toolkit. Create tools, resources, and prompt templates that AI assi

Full cross-link map for this page: [/kb/guide/how-to-create-a-contentful-asset-on-vercel.graph.md](/kb/guide/how-to-create-a-contentful-asset-on-vercel.graph.md?from=related&source_path=%2Fkb%2Fguide%2Fhow-to-create-a-contentful-asset-on-vercel&source_site=vercel-kb&relationship=graph)
<!-- /docsgraph:related -->


## 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:

```bash
vc init express express-mcp-weather
```

## 2\. Build the Weather API Endpoint

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

```typescript
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
  

```typescript
export function GET(request: Request) {
  return new Response('Hello from Vercel!');
}
```
```javascript
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)