Snippets / Tags
nextjs
11 nextjs code snippets across 3 languages. Copy-paste solutions from production code.
11
snippets
github actions
1 snippetnextjs
7 snippetsAuth-Gated proxy.ts in Next.js 16
A proxy.ts that checks the session cookie and redirects unauthenticated requests away from protected routes. Node.js runtime, no Edge.
Dynamic generateMetadata with Canonicals and OG Tags
A complete generateMetadata function for Next.js App Router pages with canonical URLs, OpenGraph, Twitter cards, and per-page overrides.
Dynamic OG Image with opengraph-image.tsx in Next.js 16
Generate per-page OpenGraph social cards at the edge with opengraph-image.tsx, Satori, and JSX. No design tools needed.
Geo-Based Redirects in Next.js 16 proxy.ts
Use proxy.ts and request geo headers to redirect users to a country-specific path or domain. Works with Vercel and any geo-aware host.
Rate-Limit a Next.js Route Handler with Upstash
A typed rate-limiter for Next.js route handlers using Upstash Redis. Sliding window, per-IP, with proper 429 responses and headers.
Streaming Server Components with Suspense and Skeletons
Use React Suspense in Next.js Server Components to stream slow data fetches with skeleton fallbacks instead of blocking the entire page.
use cache + revalidateTag in Next.js 16
How to use the 'use cache' directive with cacheTag and revalidateTag for tag-based on-demand cache invalidation in Next.js 16.
react
3 snippetsServer Action with Zod Validation and useActionState
A type-safe Next.js Server Action validated with Zod, wired to a form via useActionState for inline error rendering.
useIntersectionObserver Hook for React
A performant, TypeScript-safe React hook wrapping IntersectionObserver. Ideal for fade-in-on-scroll, lazy loading, and infinite scroll.
useScrollProgress Hook for React
A tiny, SSR-safe React hook that tracks vertical scroll progress as a 0 to 1 value. Perfect for reading progress bars and scroll-linked effects.