Next.js
SEO-grade Next.js apps with App Router, server components, and edge-ready APIs.
Next.js is my default framework for production React apps — marketing sites, B2B dashboards, NFC profile pages, and AI tooling UIs. I work primarily with the App Router and React Server Components, leveraging server-rendered routes for SEO and client components only where needed.
How I work with Next.js
I picked up Next.js when client briefs started demanding fast first-paint, SEO, and SSR/SSG together. The Pages Router was my entry point; I migrated to App Router as soon as it stabilized and have built every new project on it since.
I lean heavily on server components for SEO-critical content, generateMetadata for per-route OG and structured data, and route handlers for thin API endpoints. For state-heavy UIs I drop into client components with Framer Motion and Redux Toolkit.
This very portfolio is a Next.js app — App Router, server components, generated sitemap, JSON-LD per page, and per-page OG images via ImageResponse. I optimize for Core Web Vitals first and add interactivity second.
Next.js across business domains
Built buyer-facing listing pages with server-rendered SEO + dynamic OG images per listing for social shares.
Implemented the public profile pages on Next.js with per-profile metadata, structured data, and edge caching.
Built the operator dashboard as a Next.js App Router app, with streaming server components for long-running queries.
Delivered vehicle-detail pages with server-rendered SEO content and client-side filters for the search experience.
Real issues I resolved using Next.js
Lifted Lighthouse SEO from 64 to 100 on a marketing site
A client's marketing site, built as a SPA, was invisible in Google for its target keywords and scored 64 on Lighthouse SEO.
Re-implemented it as a Next.js App Router app with server components, per-route generateMetadata, JSON-LD Organization + WebSite schemas, a dynamic sitemap, and per-page OG images via next/og ImageResponse.
Lighthouse SEO hit 100 across all pages; first-page rankings appeared within weeks for target keywords; social shares started rendering rich previews everywhere.
Removed a 1.2MB client bundle by moving logic to the server
A dashboard was shipping a date-formatting library + a markdown renderer + a syntax highlighter to every visitor — totaling 1.2MB of JS for a page that didn't need any of it interactively.
Converted the heavy components to async server components, formatting and rendering on the server and shipping pure HTML to the client. Kept the small interactive bits as client components.
Initial JS payload dropped by 1.2MB, Time-to-Interactive halved on mid-tier devices, and Core Web Vitals turned green.
Per-listing dynamic OG images that actually scale
Pre-rendering OG images for every property listing meant 50k+ static PNGs and a slow build.
Replaced the static build step with `opengraph-image` runtime generation via Next.js ImageResponse, cached at the edge with appropriate revalidation.
Build time dropped dramatically, fresh listings got correct previews on first share, and storage cost went to ~0.
Often used together
Have a Next.js project in mind?
I am open to full-time and contract work where Next.jsis core to the stack. Let's talk about what you are building.