Praxivo — SEO-First Marketing Site

The Next.js 16 venture-studio site (App Router, React 19 RSC, Tailwind v4) that ties the products together. Your frontend/performance/SEO case study: SSG on a CDN, the metadata API, JSON-LD, and a data-driven content registry.

Next.js 16RSCSSGSEOCore Web VitalsTailwind v4

One-liner

Praxivo is the premium, SEO-first marketing site for the studio behind StockVision, LandAI and StockStump — built static-by-default so it ships as prebuilt HTML on a CDN, with structured data and zero layout shift.

Why it's worth talking about

It's small, but it's your clean frontend + performance + SEO story, and it shows you understand the modern Next.js rendering model (Server Components, SSG, the edge) rather than defaulting everything to a client-side SPA.

Architecture

Tech stack

ConcernChoice
FrameworkNext.js 16 — App Router, React 19 Server Components
StylingTailwind CSS v4 (@theme tokens), motion for animation
Fontsnext/font self-hosting Geist + Instrument Serif (no CLS)
RenderingStatic Site Generation → HTML served from Vercel's CDN
SEOMetadata API, canonicals, JSON-LD, sitemap.xml, robots.txt, OG image

The data-driven content pattern

The interesting idea: content lives in typed registries (products.ts, services.ts). Adding one entry automatically produces a card, a statically generated detail page, a sitemap.xml entry, and JSON-LD — no component changes.

// Add an entry → page + sitemap + structured data are generated for it.
export const products: Product[] = [
  { slug: "stockvision", name: "StockVision", status: "Beta", /* … */ },
];

// app/products/[slug]/page.tsx
export function generateStaticParams() {
  return products.map((p) => ({ slug: p.slug }));
}
Same pattern powers this site

PrepDeck reuses exactly this idea: dropping an .mdx file in a content folder auto-generates its route, sidebar entry, search record and prev/next links — data-driven routing instead of hand-wired pages.

SEO & performance decisions

  • SSG + CDN. Pages are prebuilt to static HTML and served from the edge — near-zero TTFB and trivially scalable; no server per request.
  • RSC by default. Server Components ship no JS for static content; interactivity is opted into with small client islands. Smaller bundles, faster hydration.
  • JSON-LD structured data (Organization / WebSite / SoftwareApplication / Service / Breadcrumb) so search engines render rich results.
  • Self-hosted fonts via next/font to eliminate the render-blocking request and the layout shift (CLS) that hurts Core Web Vitals.

Challenges & what I'd improve

  • Next.js 16 is a moving target — App Router conventions and async APIs (e.g. params is now a Promise) differ from older tutorials, so I read the bundled docs before writing.
  • Wire the contact form to a real backend (Resend/Formspree) instead of mailto:, and add analytics + Core Web Vitals monitoring.

Likely interview questions