SaaS Microservices

A SaaS dashboard that talks to 2 API microservices defined in Nitro and Hono, all running under the same domain.

SaaS Microservices

This is an example SaaS project with 2 API services defined as microservices.

Getting Started

pnpm install
pnpm dev

Open http://localhost:3024 to view the dashboard. The dashboard will make API calls to the api service for the information to display in the dashboard.

How It Works

There are 2 separate applications in this example:

dashboard - A Next.js application to show the UI. This application also controls the microfrontends.json configuration to route API paths to the other microservices (see below).
api - An Express.js backend serving data displayed in the dashboard.

These all run under the same domain. Paths to each application are routed using Vercel's microfrontends support:

Running Locally

To run all applications together, run:

pnpm dev

A local development proxy is automatically run to stitch requests from each application to the local instance of each service.

A single or subset of applications can also be run:

pnpm dev:dashboard
pnpm dev:api
pnpm turbo run dev -F api -F dashboard

GitHub repovercel/examples

Use Cases

Microfrontends Monorepos Backend

Stack

Express Next.js Tailwind

Related Templates

Next.js Multi-Zones Starter

Split a single Next.js application by path into multiple applications for faster build times and independent development.

Express.js on Vercel

Simple Express.js + Vercel example that serves html content, JSON data and simulates an API route.