§ case
Portfolio
Jul 2025 — presentFull Stack · AI · Web Development · Creator · Engineer
- —This site itself — built on Next.js 15 (App Router, React Server Components) and React 19, where every piece of content flows through one pipeline: `data/*.json` → typed getters in `lib/data.ts` → TypeScript interfaces → components, bundled at build time with zero runtime fetch for site content.
- —A hand-authored CSS design system — one global stylesheet of design tokens and shared section chrome — deliberately built without Tailwind utility classes, even though Tailwind v4 sits in the dependency tree for an earlier, now-unused design generation still on disk.
- —A floating, page-aware AI assistant on a multi-agent Mastra AI architecture — an orchestrator delegating to Project Expert and Career Expert sub-agents over Ollama Cloud, with an array of API keys wired as an automatic quota-exceeded fallback chain, chats persisted per-visitor/per-session in MongoDB.
- —A markdown-in-JSON blog rendered server-side (`marked` + Shiki syntax highlighting + `sanitize-html`), with signed 7-day draft-preview tokens, full-content RSS/JSON feeds, and dedicated `llms.txt`/`llms-full.txt` surfaces for AI crawlers.
- —Client-side view analytics written directly to MongoDB per request — no ORM, no batching — with source attribution (UTM/referrer/crawler detection) and automatic exclusion of the owner's own traffic and admin sessions.
- —Architecture overview: every public route (`/`, `/projects`, `/blog`, `/resume`) is static/SSG since nothing touches the database during render; unknown slugs get a real 404 from Next.js middleware rather than a soft-404; and a local-only admin CMS — scrypt-hashed auth behind an HS256 JWT, atomic writes gated to non-production, with a one-click git panel to stage, commit, and push — is how the whole site gets edited.
Next.js 15React 19TypeScriptMastra AIOllama CloudMongoDBShikiZodVercel
◼ Challenges
- →Keep every public page static and served from the CDN while still supporting live view analytics, a stateful AI assistant, and an admin CMS with real database writes
- →Avoid Next.js's default soft-404 behavior for unknown slugs, which search engines and AI crawlers treat as a quality problem
- →Let a non-technical editing session write directly to git-tracked JSON and markdown files, with no CMS or database in production
◼ Solutions
- →View tracking, the AI assistant, and admin writes all run client-side or off the render path — SSR never touches the database, so every public page stays static/SSG on the CDN
- →Unknown slugs are rewritten to a real 404 in middleware — evaluated before rendering starts, using slug lists inlined from data/ at build time — instead of relying on a dynamically-rendered notFound()
- →Admin writes are atomic and gated to non-production by NODE_ENV, landing as plain JSON/Markdown files in data/; a one-click git panel stages, commits, and pushes them straight from the dashboard
