#nextjs

9 snippets tagged with #nextjs

typescriptintermediate

Type-Safe API Route Handler

Next.js App Router route handler with input validation, typed responses, and proper error handling.

#api#route-handler
typescriptintermediate

Authentication Middleware Guard

Next.js middleware that checks auth tokens on protected routes and redirects unauthenticated users to login.

#middleware#authentication
typescriptintermediate

Server Action with Form Validation

Next.js Server Action handling form submissions with validation, error messages, and redirect on success.

#server-actions#forms
typescriptadvanced

Dynamic OG Image Generation

Generate Open Graph images on-the-fly using Next.js ImageResponse with custom fonts and dynamic content.

#og-image#seo
typescriptadvanced

On-Demand ISR Revalidation

Trigger incremental static regeneration via API route with secret token validation for instant cache purge.

#isr#revalidation
typescriptbeginner

Protected Page with Server Redirect

Server Component that checks auth status and redirects unauthenticated users before rendering any content.

#auth#redirect
typescriptbeginner

Reusable Metadata Factory

Factory function to generate consistent SEO metadata across all pages with Open Graph and canonical URLs.

#seo#metadata
typescriptadvanced

Parallel Routes Layout

Next.js parallel routes pattern to render multiple page slots simultaneously in a shared layout.

#parallel-routes#layout
typescriptintermediate

Next.js AI Streaming Route Handler

Stream OpenAI responses from a Next.js App Router route handler using the Vercel AI SDK.

#nextjs#openai