TanStack Start

TanStack Start uses Vinxi under the hood and supports standard fetch handlers.

1. Install

npm install eridu-tech hono

2. Create the handler

app/routes/api.$.ts

import { HttpRouter, defaultHttpRouterAdapter } from "eridu-tech/http-router";
import { createFileRoute } from "@tanstack/react-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(),
        );
    },
});

const handler = async ({ request }: { request: Request }) => {
    return router.fetch(request);
};
export const Route = createFileRoute("/api/$")({
    server: {
        handlers: {
            GET: handler,
            HEAD: handler,
            POST: handler,
            PUT: handler,
            DELETE: handler,
            PATCH: handler,
            OPTIONS: handler,
        },
    },
});

File structure

.
├── app
│   └── routes
│       └── api.$.ts
├── package.json

3. Develop

npm run dev

4. Build

npm run build

Reference: TanStack Start API Routes