THE WEBMCP CHALLENGE
UNLOCK CREDITS
NETLIFY RESOURCES

A starter, and four
demos to pull apart.

WebMCP-specific resources from Netlify. Every one of them is a live site you can open and poke at with an agent — built on the same primitives you get for your own entry.

Start from a terminal.

The starter below is prompt-first: in its own words, “there is nothing to fork and nothing to download.” There is no scaffolding command, so if you would rather type than prompt, build the project however you normally would and let the Netlify CLI do the wiring.

01 / DEPLOY THE PROJECT

# one-time — needs Node 18.14 or later
npm install -g netlify-cli
netlify login

# in your project — any framework, or none
netlify init           # create the site + CI
netlify dev            # local server + functions
netlify deploy --prod  # ship it

Every command above is from the CLI getting-started guide. Already deployed from a repo? netlify link attaches an existing project instead.

02 / REGISTER A TOOL

const modelContext =
  document.modelContext ?? navigator.modelContext

if (modelContext &&
    'registerTool' in modelContext) {
  const controller = new AbortController()
  await modelContext.registerTool(
    definition,
    { signal: controller.signal }
  )
}

Quoted verbatim from the WebMCP Starter, which notes that provideContext(), clearContext() and unregisterTool() were removed from the spec — abort the signal you passed at registration to remove a tool.

03 / LET THE BROWSER SEE IT

# netlify.toml
[[headers]]
  for = "/*"
  [headers.values]
    Origin-Agent-Cluster = "?1"
    Permissions-Policy = "tools=(self)"

WebMCP needs a secure context and an origin-isolated document. Both are already true on Netlify; the starter sends these two headers explicitly so a later change cannot silently switch the API off.

STARTER

WebMCP Starter

A prompt-first starter template. Instead of forking a repo, copy a prompt from here and hand it to your favorite agent — the agent builds and deploys the whole site on Netlify with Agent Runners.

webmcp-starter.netlify.app

DEMO · COMMERCE

Kurio

A fictional marketplace. Agents can search products, add items to a cart, and complete a simulated checkout flow. The /learn page shows exactly what the agent sees.

webmcp-kurio.netlify.app

DEMO · MODERATION

Tagboard

A public guestbook where agents read and post notes. Every write passes through an AI moderation layer running on Netlify’s AI Gateway.

webmcp-tagboard.netlify.app

DEMO · STATEFUL

Mabel’s Table

A fictional restaurant with real reservation state. Agents hit genuinely full time slots, negotiate alternatives, place holds, confirm bookings, look reservations up, and cancel them.

webmcp-mabels-table.netlify.app

DEMO · COLLABORATIVE

The Archive

A detective mystery built for a human and their agent to solve together. Some clues are visual, others are only reachable through tools.

webmcp-archive.netlify.app

Where to test it.

No browser enables WebMCP by default yet, so nothing you build will look wired up until you opt in. Two places work today.

WORKS OUT OF THE BOX

ChatGPT’s in-app browser

No setup required. Open your app inside ChatGPT and its agent picks up the tools you expose.

Which Netlify piece
does what.

Your 3,000 credits buy time on all of these. This is the short version of which one to reach for when.

  • FUNCTIONS ↗

    Server-side handlers behind your tools — where validation and authorization actually belong.

  • EDGE FUNCTIONS ↗

    The same idea, run close to the user, for tool calls where round-trip latency shows.

  • AI GATEWAY ↗

    Model access without bringing your own provider key — Tagboard moderates every write through it.

  • BLOBS ↗

    State that has to survive between tool calls. It provisions itself on first write, so it works on the first deploy.

  • NETLIFY DB ↗

    Managed Postgres for relational state — the kind of thing Kurio’s catalog and cart are built on.

  • IMAGE CDN ↗

    Transform and serve images on the fly, for when a tool hands the agent something to look at.

Before you start.

The questions worth answering before you spend an evening on this. Anything not answered here lives on the official pages, not on this one.

GETTING STARTED

Do I need an app already?

No. The starter carries two prompts: one builds an agent-ready site from nothing, the other inventories a site you already run and wraps its existing capabilities as tools.

STACK

Does my framework matter?

Registration is the same document.modelContext call either way. Netlify’s own demos span a deliberately no-build static site and a TanStack Start app.

TOOL DESIGN

Should tools be a separate API?

The starter is emphatic that they should not: a tool wraps code the site already has, so a human and an agent can never be told different things. It also warns that a tool declaration is a hint to a cooperative agent, never a security boundary — validate on the server too.

GOTCHAS

Is there an older API I might copy by mistake?

Yes, and models still suggest it. provideContext(), clearContext() and unregisterTool() have all been removed. Current code calls registerTool(definition, { signal }) and aborts the signal to unregister.

STATE

Where does my data live?

Blobs for anything key-value, Netlify Database when it is relational. Both provision from the platform, so there is no external database to sign up for mid-challenge.

THE RULES

Where do the official rules live?

Not here. Entry, eligibility and judging are OpenAI’s and Devpost’s to state, and the key links page goes straight to both.

Credits to run them on.

The first 1,000 builders to sign up get 3,000 Netlify credits each — enough to deploy, run, and iterate on your entry for the length of the challenge.

UNLOCK 3,000 CREDITS SEE THE PRIZES