The NextRequest and NextResponse Objects

NextRequest and NextResponse are the Next.js versions of the Request and Response objects from the standard fetch API. They have extension methods for manipulating cookies, redirecting or rewriting responses, and working with middleware using the next() method. The nextUrl object included in next/server provides detailed information about a URL, such as basePath, trailingSlash and locale. NextRequest and NextReponse can be used as a drop-in replacement for their fetch equivalent.

Use cases, tips & tricks

  • Use usePathname() to detect if a link is active and to add an active CSS class.
  • Use #id to scroll the page to a specific location.