項目作品/宿霧科爾多瓦旅遊CMS

Next.js 16React 19TypeScriptTailwind CSS v4Prisma ORMPostgreSQLModel Context Protocol (MCP)Framer MotionCloudflare R2DockerTraefik

宿霧科爾多瓦旅遊CMS

live · maintained

語言版本：

基於Next.js 16打造嘅旅遊與商業投資平台,具備即時熱度分析同內置AI MCP伺服器。

造訪網站 ↗

cordova.humfurie.org

Cover

為菲律賓宿霧科爾多瓦打造嘅高性能市政入口網站與無頭CMS。具備電影感嘅3D環繞主視覺、動態"Popular Now"熱度引擎、自動化SEO元數據生成,以及用於自主AI管理嘅內置Model Context Protocol(MCP)伺服器。

Featured Engineering & Architecture

How the Hardest Problems Were Solved

Key architectural decisions, concrete code implementations, and performance wins behind this project.

Architectureapp/api/mcp/route.ts

Embedded Model Context Protocol (MCP) Server with Edge-Compatible HTTP Transport & JWT Auth

The Challenge

Exposing internal CMS operations (business listings, blog posts, media uploads, trending analytics, and hero settings) directly to external AI agents and LLM tooling without building redundant REST endpoints or compromising Next.js App Router security.

The Architectural Solution

Implemented an embedded Streamable HTTP MCP server inside the Next.js Route Handler using @modelcontextprotocol/sdk, securing all incoming AI agent operations with stateless JWT verification via jose and modular domain toolkits.

Impact:Consolidated 6 administrative domains into a standardized agent-accessible protocol interface, enabling zero-friction AI assistant workflows with sub-10ms stateless auth overhead.

app/api/mcp/route.ts

async function handleMcpRequest(request: NextRequest): Promise<Response> {

if (!(await isAuthorized(request))) return unauthorized();

const server = createMcpServer();

const transport = new WebStandardStreamableHTTPServerTransport({

sessionIdGenerator: undefined,

});

await server.connect(transport);

return transport.handleRequest(request);

}

Discuss this snippet (app/api/mcp/route.ts)

Backendlib/trending.ts

Cascading Real-Time Trending Engine with ISR Cache Layers

The Challenge

Calculating real-time 'Popular Now' content rankings from raw PageView timeseries telemetry without bottlenecking the database or serving stale/empty results during low-traffic windows.

The Architectural Solution

Built an aggregation engine in lib/trending.ts that groups page views by customizable time windows, falls back smoothly across cascading intervals (1h → 1d → 1w → all-time), and caches computed rankings via Next.js unstable_cache with interval-specific TTLs.

Impact:Reduced database aggregation query frequency by over 95% while guaranteeing zero empty trending widgets through fallback cascading.

Seolib/seo.ts

Universal Dynamic Schema.org & OpenGraph Metadata Generator

The Challenge

Maintaining rich search previews and Schema.org structured data (TouristDestination, LocalBusiness, Article, BreadcrumbList) dynamically across multi-tenant routes with varying fallbacks and strict search engine compliance.

The Architectural Solution

Created a centralized builder utility in lib/seo.ts that produces typed OpenGraph, Twitter cards, and Schema.org graphs for business listings, municipal attractions, and editorial content.

Impact:Achieved 100% Schema.org valid JSON-LD across all dynamic listing and editorial pages with automated canonical link resolution.

// community_discussion

Architecture Feedback & Questions

Have thoughts, questions, or ideas regarding this system's architecture? Leave a comment below with your GitHub account.