How I Used Next.js as Both the Frontend AND the Backend for My Microservices

We are building a fintech product. The backend is a set of microservices — each service does one job, like handling payments, managing users, or dealing with authentication. For the frontend, we chose Next.js. But here is the interesting part: Next.js ended up doing two jobs in our architecture. It renders the UI that the user sees — pages, components, everything visual. It also acts as a Backend for Frontend (BFF) — a server layer that sits between the browser and our real microservices. One Next.js project. Two responsibilities. This is the story of why I made that call, what it gave us, and what it cost us. What Does "Next.js as BFF" Actually Mean? Next.js is not just a frontend framework. It also lets you write API routes — real server-side code that runs on a Node.js server, not in the browser. So our Next.js project has two parts living side by side: /app /dashboard ← React pages (frontend) /profile ← React pages (frontend) /app/api /auth ← API route (BFF — calls Auth microservic