This example shows how to use Middleware in Next.js to run code before a request is completed.

The index page (app/page.tsx) has a list of links to pages with redirect, rewrite, or normal behavior.

On the Middleware file (middleware.ts) the routes are already being filtered by defining a matcher on the exported config. If you want the Middleware to run for every request, you can remove the matcher.

Deploy the example using Vercel or preview live with StackBlitz

Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:

npx create-next-app --example middleware middleware-app

yarn create next-app --example middleware middleware-app

pnpm create next-app --example middleware middleware-app

Deploy it to the cloud with Vercel (Documentation).