Feedback regarding BFF design
Unanswered
Bumble bee posted this in #help-forum
Bumble beeOP
Hey all, wanted to get some feedback on a potential approach for introducing a BFF pattern in our Next.js app:
Right now, we’re handling a lot of data fetching and service logic directly in our page components. The plan is to move that logic into API routes under /api/, backed by shared modules (e.g. in a lib/bff folder). The frontend would then fetch from these internal API routes — either server-side (SSR) or client-side — instead of talking directly to services or running complex logic.
The idea is to decouple frontend pages from backend complexity, centralize things like error handling and logging, and make it easier to introduce things like caching or auth later.
Does this seem like a reasonable pattern for a BFF in Next.js?
Right now, we’re handling a lot of data fetching and service logic directly in our page components. The plan is to move that logic into API routes under /api/, backed by shared modules (e.g. in a lib/bff folder). The frontend would then fetch from these internal API routes — either server-side (SSR) or client-side — instead of talking directly to services or running complex logic.
The idea is to decouple frontend pages from backend complexity, centralize things like error handling and logging, and make it easier to introduce things like caching or auth later.
Does this seem like a reasonable pattern for a BFF in Next.js?
8 Replies
Asian black bear
Not really since this forces you to do client-side fetching. Server-side code should never fetch its own routes.
What you'd be basically doing is to move all the data-fetching code from page components into their separate server-side functions that you can structure as you want and call them instead of doing a lot of business logic in server components.
The next step would be to just introduce a separate backend not written in Next altogether and fetch that.
The whole point of Next and RSC however is that you don't need a separate backend.
@Asian black bear What you'd be basically doing is to move all the data-fetching code from page components into their separate server-side functions that you can structure as you want and call them instead of doing a lot of business logic in server components.
Asian black bear
Btw doing exactly this is completely fine, however forcefully adding route handlers and fetching them on the server is useless and even detrimental.
Bumble beeOP
Thanks for the reply! That makes sense abd I guess the separate backend could be a node layer sitting in the next app maybe using express, or is there a better alternative?
Asian black bear
I don't understand the "node layer in the next app" part. A separate backend is unrelated to your Next app and can be written in any language or using any framework. If you want to use JS based tooling go with Hono for something lightweight or Nest.js for something robust.
Bumble beeOP
Yep apologies incorrect wording. But that makes sense, I will take a look at Hono