[V11] BFF Monorepo setup

Hello! I have a monorepo with several apps, every app has its tRPC endpoint setup like this.

// app/api/trpc/[trpc].ts

import { fetchRequestHandler } from "@trpc/server/adapters/fetch";

import { appRouter, createTRPCContext } from "@acme/api";
import { auth } from "@acme/auth";

export const runtime = "edge";

const handler = auth(async (req) => {
    const response = await fetchRequestHandler({
        endpoint: "/api/trpc",
        router: appRouter,
        req,
        createContext: () =>
            createTRPCContext({
                session: req.auth,
                headers: req.headers,
            }),
        onError({ error, path }) {
            console.error(`>>> tRPC Error on '${path}'`, error);
        },
    });

    return response;
});

export { handler as GET, handler as POST };

// app/api/trpc/[trpc].ts

import { fetchRequestHandler } from "@trpc/server/adapters/fetch";

import { appRouter, createTRPCContext } from "@acme/api";
import { auth } from "@acme/auth";

export const runtime = "edge";

const handler = auth(async (req) => {
    const response = await fetchRequestHandler({
        endpoint: "/api/trpc",
        router: appRouter,
        req,
        createContext: () =>
            createTRPCContext({
                session: req.auth,
                headers: req.headers,
            }),
        onError({ error, path }) {
            console.error(`>>> tRPC Error on '${path}'`, error);
        },
    });

    return response;
});

export { handler as GET, handler as POST };

The api is consumed using a caller using a createCaller function exported by the

@acme/api

@acme/api

package (inside this package I have a trpc router with everything)

I want to remove the package and deploy a separated BFF, so every app in the repo can do api requests to the BFF.

I cannot find a way to tell my server caller to do fetchRequest to a custom endpoint, I guess i am missing something.

I hope everything is clear, thank you!

[V11] BFF Monorepo setup

Hello! I have a monorepo with several apps, every app has its tRPC endpoint setup like this.

// app/api/trpc/[trpc].ts

import { fetchRequestHandler } from "@trpc/server/adapters/fetch";

import { appRouter, createTRPCContext } from "@acme/api";
import { auth } from "@acme/auth";

export const runtime = "edge";

const handler = auth(async (req) => {
    const response = await fetchRequestHandler({
        endpoint: "/api/trpc",
        router: appRouter,
        req,
        createContext: () =>
            createTRPCContext({
                session: req.auth,
                headers: req.headers,
            }),
        onError({ error, path }) {
            console.error(`>>> tRPC Error on '${path}'`, error);
        },
    });

    return response;
});

export { handler as GET, handler as POST };

// app/api/trpc/[trpc].ts

import { fetchRequestHandler } from "@trpc/server/adapters/fetch";

import { appRouter, createTRPCContext } from "@acme/api";
import { auth } from "@acme/auth";

export const runtime = "edge";

const handler = auth(async (req) => {
    const response = await fetchRequestHandler({
        endpoint: "/api/trpc",
        router: appRouter,
        req,
        createContext: () =>
            createTRPCContext({
                session: req.auth,
                headers: req.headers,
            }),
        onError({ error, path }) {
            console.error(`>>> tRPC Error on '${path}'`, error);
        },
    });

    return response;
});

export { handler as GET, handler as POST };

The api is consumed using a caller using a createCaller function exported by the

@acme/api

@acme/api

[V11] BFF Monorepo setup

Similar Threads

[V11] BFF Monorepo setup

Similar Threads

Similar Threads

Similar Threads