Client-Side WebMCP & RFC 9727 Agent Discovery
Making Your Web Application Discoverable to Browser and Cloud Agents
Browser-based AI agents shouldn't have to scrape fragile DOM selectors when your app can register structured tools directly on navigator.modelContext.
if (typeof navigator !== "undefined" && "modelContext" in navigator) {
(navigator as any).modelContext.registerTool({
name: "open_course_lesson",
description: "Navigate directly to a CodingCat.dev course lesson by slug",
inputSchema: {
type: "object",
properties: { courseSlug: { type: "string" }, lessonSlug: { type: "string" } },
required: ["courseSlug", "lessonSlug"],
},
execute: async ({ courseSlug, lessonSlug }: { courseSlug: string; lessonSlug: string }) => {
window.location.href = `/course/${courseSlug}/lesson/${lessonSlug}`;
return { navigated: true };
},
});
}Production Architecture Takeaway
Pair client-side WebMCP tools with /.well-known/api-catalog and /llms.txt so both browser agents and headless crawlers discover your capabilities.
how this course connects together.
Follow AJ from first principles to production-ready architecture.
