route-handler-design

Design Next.js App Router route.ts endpoints with Web-standard Request/Response behavior.

1|Updated May 6, 2026
One-click install
npx skills add https://github.com/jacob-balslev/skill-graph --skill route-handler-design
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: route-handler-design
Source: https://github.com/jacob-balslev/skill-graph/tree/main/marketplace/skills/route-handler-design
Command: npx skills add https://github.com/jacob-balslev/skill-graph --skill route-handler-design

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Route-handler-design helps you build correct, secure Next.js App Router route.ts endpoints by preventing common framework misuses and enforcing consistent request/response and status/header behavior.

Core Features & Use Cases

  • Endpoint surface design: Choose Route Handlers when the caller is mobile, third-party, webhooks, or server-to-server rather than your own typed UI.
  • Request/response correctness: Implement Web-standard Request/Response handling, body parsing (json, formData, text, blob, arrayBuffer), and streaming with ReadableStream.
  • Framework-specific guardrails: Control default GET caching, apply segment config (dynamic, revalidate, runtime), and shape errors and CORS (including OPTIONS).

Quick Start

Tell the agent: Design a Next.js App Router route.ts webhook endpoint that verifies signatures using the raw body, acknowledges quickly, and returns correct status codes with an explicit CORS policy.

Frequently Asked Questions about route-handler-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I design a Next.js App Router route handler for webhooks with raw body verification?

To design a Next.js App Router route handler for webhooks, implement `route.ts` exports that read the raw body using `request.text` or `arrayBuffer` to verify signatures before returning an explicit success status code like 200.

When should I use Next.js Route Handlers instead of Server Actions?

Use Next.js Route Handlers when the caller is an external client such as a mobile app, third-party integration, or server-to-server webhook, whereas Server Actions are better suited for typed UI form submissions.

What is the best way to configure CORS and OPTIONS requests in a Next.js Route Handler?

The best way to configure CORS in a Next.js Route Handler is to export an explicit `OPTIONS` method function that sets the appropriate `Access-Control-Allow` headers, alongside enforcing consistent header behavior for external callers.

How do I control caching and runtime selection for a Next.js API endpoint?

Control caching and runtime selection in a Next.js API endpoint by applying segment config exports such as `dynamic`, `revalidate`, and `runtime` in your `route.ts` file to override default GET caching behavior.

Can I stream binary downloads and large responses using a Next.js Route Handler?

Yes, you can stream binary downloads and large responses in a Next.js Route Handler by returning a Web-standard `ReadableStream` within the Response object for efficient data transfer.

Why does my Next.js route handler throw an error when reading the request body twice?

Reading the request body twice in a Next.js route handler fails because Web-standard Request streams can only be consumed once, requiring you to buffer the raw body if multiple reads are needed for parsing and verification.