Back to Perspectives
System Design

Server Components, BFFs, and the Backend Illusion

Joseph Afriyie Attakorah
February 19, 2026
6 min read
#Next.js#bff#backend#frontend

Where the frontend ends, where the backend must begin, and why boundaries still matter

Modern web development has a funny habit of blurring lines that should never be blurred. Tools get better, abstractions get smoother, and suddenly people start asking dangerous questions like, “Do we even need a backend anymore?”

If you’ve worked with Next.js recently, especially React Server Components and Server Actions, you’ve probably felt this confusion firsthand. Things run on the server. Secrets stay hidden. APIs do not appear in the browser network tab. It feels like a backend.

That feeling is where architectural mistakes are born.

This article is for software engineers, senior backend engineers, frontend developers, system designers, and architects who want clarity instead of cargo culting. We’re going to cut through the illusion, define where Next.js fits, explain what a Backend For Frontend (BFF) actually is, and lay out when to choose a BFF, a monolith, or microservices without ideology.


The dangerous misconception, “Server means backend”

Next.js Server Components run on the server. That much is true.

But running on the server does not automatically make something a backend.

Server Components are rendering units, not domain owners. Their primary job is to fetch data, compose UI, and send HTML efficiently to the browser. They are invisible to the client, never shipped as JavaScript, and can safely access secrets.

All good things.

But here’s the line people keep crossing.

A real backend:

  • Owns business rules
  • Enforces invariants
  • Defines explicit, stable contracts
  • Serves multiple clients
  • Survives frontend rewrites

Server Components do none of that by design.

They are not meant to be reused by mobile apps, third party integrations, or other services. They do not expose versioned APIs. They are not a source of truth.

They are infrastructure for presentation, not guardians of business reality.


“But the API call is hidden from the browser”

Yes, and that’s a feature, not a boundary.

When a Server Component calls api.backend.com/products, the browser never sees that request. Credentials stay server side. The endpoint is not replayable from DevTools. That’s good security hygiene.

But do not confuse invisibility with isolation.

The backend API is still:

  • Publicly reachable
  • Independently attackable
  • Contract driven
  • A separate trust zone

You did not eliminate the boundary. You correctly controlled who is allowed to cross it.

Security is not about hiding things. Security is about explicit trust boundaries.


Where Server Components truly shine

Server Components are excellent when the problem is rendering, not domain ownership.

They are at their best when:

  • Pages are data heavy and SEO sensitive
  • Multiple backend calls need to be composed into one view
  • Client side JavaScript must be minimized
  • Secrets and tokens must stay off the browser
  • Personalized data needs to be rendered efficiently

Think dashboards, product pages, admin panels, read heavy personalized views.

They are a perfect fit for UI orchestration, not business logic.

If deleting a page breaks your business rules, you put logic in the wrong place.


Next.js as a Backend For Frontend, the correct mental model

This is where Next.js fits beautifully.

A Backend For Frontend is:

  • Client specific
  • UI focused
  • Responsible for aggregation and transformation
  • Not responsible for business truth

Next.js Server Components and Server Actions make an excellent BFF layer.

A good BFF:

  • Shapes backend responses for the UI
  • Handles auth tokens and sessions
  • Fans out and fans in backend calls
  • Applies caching and feature flags
  • Optimizes network behavior for a specific client

A bad BFF:

  • Implements pricing rules
  • Decides permissions
  • Manages state transitions
  • Becomes the only place logic exists

If another client needs the same logic, it does not belong in the BFF.


Monoliths, the misunderstood workhorse

Monolith is not a dirty word. “Big ball of mud” is.

A well structured monolith has:

  • Clear internal boundaries
  • One deployment unit
  • One database
  • One source of truth

Choose a monolith when:

  • You have one primary client
  • The team is small to medium
  • The domain is still evolving
  • Speed of iteration matters
  • Internal discipline exists

A monolith paired with a Next.js BFF is often the most productive and least risky architecture for years.

Splitting early does not make you scalable. It makes you distributed and fragile.


Microservices, powerful and expensive

Microservices are not a badge of seniority. They are a tax you pay when you must.

They make sense only when:

  • Teams need independent ownership
  • Services must scale independently
  • Domains are stable and well understood
  • Failure isolation is critical
  • Deployment coordination is painful

If you do not have organizational pain, microservices will manufacture it for you.

Architecture should solve real problems, not imaginary future ones.


A simple decision framework

Ask these questions in order.

Do multiple clients consume the same logic?

  • Yes, backend service
  • No, monolith or BFF is fine

Does this logic define business truth?

  • Yes, backend
  • No, BFF or Server Component

Will this logic outlive the UI?

  • Yes, backend
  • No, Server Component

Do I need independent scaling and deployment?

  • Yes, services
  • No, monolith

This framework will save you more time than any diagram.


The hierarchy that keeps you sane

Think in layers, not tools.

  • Domain layer, backend services or monolith
  • Application layer, APIs
  • Presentation layer, Next.js BFF
  • Rendering layer, Server Components

Server Components sit at the bottom of importance.

They make experiences fast and elegant. They do not make systems correct.


Final takeaway

Next.js Server Components are powerful, elegant, and dangerous if misunderstood.

They are not a backend. They are not a replacement for APIs. They are not a domain boundary.

They are a phenomenal Backend For Frontend, and that is already a big win.

Keep business logic behind real APIs. Let boundaries be explicit. Use Next.js aggressively where it excels, rendering and orchestration.

Modern tools do not remove the need for architecture. They make bad architecture easier to ship faster.

And that’s the real trap.