The web was built for humans.
AI agents are not humans.
Today, many agents still use websites like a person would: read the page, inspect the DOM, guess which button to click, fill a form, and hope the UI did not change.
That is useful.
But it is also fragile.
WebMCP points to a different future: websites can expose structured tools directly from the page.
Instead of an agent guessing what a website can do, the website can declare it:
products.search
cart.add
checkout.start
project.create
report.generate
user.invite
These are not random clicks.
They are explicit capabilities with names, descriptions, schemas, and functions.
That is the interesting part.
Not “AI clicks buttons better.”
Something much better:
Websites become understandable and actionable for agents.
Why this matters
If agents become a real interface to software, websites need more than visual UI.
They need an agent-facing surface that is:
- clear
- typed
- validated
- safe
- testable
- connected to the real product flow
WebMCP gives the browser-level direction.
But developers still need a practical layer to use it well.
The missing developer layer
Registering a tool is only the beginning.
The real production questions are:
- Is the input valid?
- Is this action read-only or dangerous?
- Should the user confirm it first?
- Can I audit what happened?
- Can I test this before exposing it to an agent?
- Can I use this cleanly in React or Next.js?
There is a big difference between:
products.search
and:
checkout.start
user.delete
message.send
team.invite
Some tools read data.
Some change state.
Some may cost money.
Some affect other users.
That difference should be part of the developer experience.
What I’m building
Not a new protocol.
Not a replacement for WebMCP.
A small, practical layer that helps developers expose WebMCP tools with better defaults.
The first focus:
typed tool registration
schema validation
risk levels
permission rules
human confirmation
audit hooks
React / Next.js friendly APIs
testing utilities
clear examples
The API should feel familiar:
mcp.tool("cart.add", {
description: "Add a product to the user's cart",
input: z.object({
productId: z.string(),
quantity: z.number().min(1),
}),
risk: "high",
requireConfirmation: true,
run: async ({ productId, quantity }) => {
return cart.add(productId, quantity);
},
});
You can explore the project here:
- GitHub: https://github.com/beladevo/webmcp.js
- Docs: https://webmcp.webml.co.il/
- Demo: https://webmcp.webml.co.il/demo
The wrapper is not the point.
The point is the system around the tool:
validation
permissions
confirmation
safe defaults
testing
debugging
developer experience
The purple cow
Most websites today are made for humans only.
The remarkable websites will be different.
They will have two interfaces:
- A visual interface for people
- A structured interface for agents
That second interface should not be an afterthought.
It should be safe, typed, intentional, and built into the product.
That is the idea behind webmcp.js.
Open source
This space is still early.
That is why I want to build it in public, follow the standard closely, and avoid hype.
The project will be released under the MIT License.
Contributions will be welcome around:
examples
TypeScript API design
permissions and safety
React / Next.js integration
testing utilities
documentation
security review
tracking WebMCP changes
Try it / contribute
The project is open source and available here:
- GitHub: https://github.com/beladevo/webmcp.js
- Docs: https://webmcp.webml.co.il/
- Demo: https://webmcp.webml.co.il/demo
If you’re interested in WebMCP, browser agents, TypeScript API design, permissions, or developer tooling — contributions are welcome.
The goal
Make websites agent-ready without making them unsafe or hard to maintain.
If WebMCP becomes an important bridge between websites and AI agents, developers will need more than a browser API.
They will need a clean, safe, typed, production-minded way to use it.
That is what I want webmcp.js to become.