The Commons

Inspiration

Agents are getting good at driving a browser like a person would — click, type, scroll, screenshot, repeat. That works, but it's slow and brittle, and it treats the agent like a guest who has to guess at a UI built for someone else. WebMCP flips that: the page itself can say, in plain terms, "here's what you're actually allowed to do here." We wanted to build something small enough to finish quickly but real enough to show what that unlocks — a space where a person and an agent aren't just co-existing on the same page, they're editing the same shared thing, together, in view of each other.

What it does

The Commons is a shared idea board about the future of the open web. A person can post an idea, tag it, upvote it, or link it to another idea through the normal UI. An AI agent visiting the same page in a WebMCP-enabled browser gets seven registered tools — add_idea, list_ideas, search_ideas, connect_ideas, upvote_idea, remove_idea, get_board_summary — that operate on the exact same board. Every tool call the agent makes shows up instantly in an on-page activity feed, and agent-authored ideas are visually distinct (teal) from human ones (amber), so provenance is never ambiguous. Because the board lives on a shared backend rather than in localStorage, two different people (or a person and an agent) genuinely see and build on each other's contributions in the same session.

How we built it

The frontend is a single static index.html — no framework, no build step — that registers its tools with document.modelContext.registerTool() on load, each with a name, a plain-language description, and a JSON Schema input contract. Read-only tools (list_ideas, search_ideas, get_board_summary) are marked with readOnlyHint: true. The execute function for every tool calls the same small REST API that the human-facing UI calls, so there's exactly one source of truth for board state, mutated by two different actors. The backend is a small Express server with a JSON-file store, deployed on Railway; the frontend is deployed separately on Vercel and points at it via a configurable API base URL. The page polls the API every few seconds so a person watching sees an agent's edits without refreshing.

Challenges we ran into

Getting the mutation model right took a couple of passes — early on the WebMCP tools and the UI's own click handlers each had their own copy of the board, which meant an agent's edit wouldn't show up until a manual refresh. Routing every mutation, human and agent alike, through the same API call fixed that and made the "co-creating in real time" story actually true instead of just visually implied.

What's next

Multiplayer presence (showing who's currently viewing the board), letting the agent read why a person upvoted something before adding a related idea, and exposing the same tool set to iframed origins via exposedTo so a partner site could embed The Commons and let its own visitors' agents contribute too.

Built With

• css
• express.js
• html
• javascript
• node.js
• railway
• rest-api
• vercel
• webmcp