Next.js App Router

HttpRouter can be used directly with Next.js App Router route handlers.

1. Install

npm install eridu-tech hono

2. Create the handler

app/api/[[...route]]/route.ts

import { HttpRouter, defaultHttpRouterAdapter } from "eridu-tech/http-router";

const router = new HttpRouter({
    router: defaultHttpRouterAdapter(),
    baseUrl: "/api",
});

router.endpoint({
    url: "/hello/:name?",
    method: ["GET", "HEAD", "POST", "PUT", "DELETE", "PATCH", "OPTIONS"],
    handler: (args) => {
        const { name } = args.req.params();
        return args.text(
            [
                `METHOD: ${args.req.method},`,
                "Hello from Next.js",
                name ?? "",
                "!",
            ]
                .filter((str) => str !== "")
                .join(" ")
                .trim(),
        );
    },
});

export const GET = async (request: Request) => router.fetch(request);
export const HEAD = async (request: Request) => router.fetch(request);
export const POST = async (request: Request) => router.fetch(request);
export const PUT = async (request: Request) => router.fetch(request);
export const DELETE = async (request: Request) => router.fetch(request);
export const PATCH = async (request: Request) => router.fetch(request);
export const OPTIONS = async (request: Request) => router.fetch(request);

File structure

.
├── app
│   └── api
│       └── [[...route]]
│           └── route.ts
├── package.json

3. Develop

npm run dev

4. Build

npm run build

5. Start

npm start

info

Next.js automatically maps HTTP methods to the exported handler names (GET, POST, etc.). Route groups and prefixes defined via HttpRouter.route() map to the file-system route.

Reference: Next.js Route Handlers