feat(web): SEO — server-rendered template pages + /guides articles - templates/[slug] converted from client to server component: per-template generateMetadata (title/description/canonical/OG) + SoftwareApplication JSON-LD; code-audit toggle split into a client island; missing/non-public templates now return a real 404. - sitemap.ts pulls public template slugs live from the API (best-effort) + the new /guides routes. - new /guides section: 3 server-rendered SEO articles (host MCP with OAuth, hosted-platforms comparison, MintMCP alternative) with TechArticle JSON-LD; Guides link added to the marketing nav. - lib/seo.ts: articleJsonLd + templateJsonLd builders. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> @
65 lines
2.5 KiB
TypeScript
65 lines
2.5 KiB
TypeScript
import { pageMetadata } from '@/lib/seo';
|
|
import Link from 'next/link';
|
|
|
|
export const metadata = pageMetadata({
|
|
title: 'MCP guides',
|
|
description:
|
|
'Practical guides on hosting, securing and shipping Model Context Protocol (MCP) servers — OAuth 2.1, remote transport, platform comparisons.',
|
|
path: '/guides',
|
|
});
|
|
|
|
const GUIDES = [
|
|
{
|
|
slug: 'host-mcp-server-with-oauth',
|
|
title: 'How to host a remote MCP server with OAuth (2026)',
|
|
description:
|
|
'Streamable HTTP, OAuth 2.1, PKCE and Resource Indicators — what it actually takes to put a remote MCP server in production, and the shortcuts.',
|
|
tag: 'Guide',
|
|
},
|
|
{
|
|
slug: 'hosted-mcp-platforms-compared',
|
|
title: 'Hosted MCP platforms compared: Cloudflare, Smithery, Composio & generating your own',
|
|
description:
|
|
'The MCP hosting landscape splits into four categories. Which one fits depends on whether you have a server already, need a catalog, or need bespoke logic.',
|
|
tag: 'Comparison',
|
|
},
|
|
{
|
|
slug: 'mintmcp-alternative',
|
|
title: 'MintMCP alternative: generate and host a custom MCP server',
|
|
description:
|
|
'MintMCP wraps an existing STDIO server into a remote one. If you do not have a server yet, here is the generate-from-a-prompt route — and where MintMCP still wins.',
|
|
tag: 'Alternative',
|
|
},
|
|
];
|
|
|
|
export default function GuidesIndex() {
|
|
return (
|
|
<div className="mx-auto max-w-3xl px-6 py-14">
|
|
<h1 className="text-[28px] font-semibold tracking-tight text-[--color-fg]">MCP guides</h1>
|
|
<p className="mt-2 text-[14.5px] leading-relaxed text-[--color-fg-muted]">
|
|
Hosting, auth and shipping for Model Context Protocol servers — written for people building
|
|
real tools, not demos.
|
|
</p>
|
|
<div className="mt-8 space-y-3">
|
|
{GUIDES.map((g) => (
|
|
<Link
|
|
key={g.slug}
|
|
href={`/guides/${g.slug}`}
|
|
className="block rounded-lg border border-[--color-border] p-4 transition-colors hover:bg-[--color-bg-subtle]"
|
|
>
|
|
<span className="mono text-[10.5px] uppercase tracking-wider text-[--color-fg-subtle]">
|
|
{g.tag}
|
|
</span>
|
|
<h2 className="mt-1 text-[16px] font-semibold tracking-tight text-[--color-fg]">
|
|
{g.title}
|
|
</h2>
|
|
<p className="mt-1.5 text-[13px] leading-relaxed text-[--color-fg-muted]">
|
|
{g.description}
|
|
</p>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|