How it Works

Monorepo Boilerplate is designed as a modern monorepo architecture that unifies the backend API, frontend applications, and shared packages into a cohesive ecosystem.

Ecosystem Overview

At a high level, Monorepo Boilerplate consists of three main layers:

1. Core API (apps/api): A NestJS-based backend that serves as the central nervous system. It handles:

   • Authentication (OIDC Provider)
   • Data management (PostgreSQL with TypeORM)
   • Business logic modules
   • File storage and external integrations

2. Frontend Applications:

   • Accounts (apps/accounts): An Angular application responsible for user management, authentication flows, and profile settings.
   • Docs (apps/docs): This documentation site, built with React, Vite, and Fumadocs.

3. Shared Packages (packages/*):

   • UI: Shared design system and components.
   • Config: Shared ESLint, TypeScript, and other configuration files to ensure consistency across the monorepo.
   • Shared: Common utilities and types shared between backend and frontend.

The Flow

When a user interacts with the system:

1. They typically start at a frontend application.
2. If authentication is required, they are redirected to the OIDC provider hosted within the API.
3. Once authenticated, the frontend communicates with the API using REST endpoints.
4. The API processes requests, interacting with the database and other services, and returns the data.

Scalability

The monorepo structure allows for vertical and horizontal scalability. New applications can be added easily (apps/new-app) while consuming the same shared packages and API structure. The backend is modular, allowing specific modules to be extracted into microservices if needed in the future, although the current monolithic deployment offers simplicity and performance.