Basics

Overview

The GadgetFest frontend is built as a multi-app Angular monorepo using Angular 19.2.0. This architecture enables code sharing between applications while maintaining clear boundaries between different user experiences.

Core Architecture

The frontend codebase follows these key architectural principles:

• Monorepo Structure: All frontend code lives in a single repository, managed with pnpm

• Multi-App Approach: Separate applications for different user types

• Shared Libraries: Common UI components and utilities are extracted into reusable libraries

• Modern Angular: Built with Angular 19.2.0 using standalone components

Project Structure

Applications

The frontend consists of three main applications:

1. Admin App: Internal dashboard for administrators

2. Customer App: Public-facing application for end users

3. Terminal App: Application for physical terminals/kiosks

Each application has its own:

• Entry point and routing configuration

• Environment configuration

• Styling and theming

• Build configuration

Shared Libraries

The codebase includes a shared UI library that contains:

• Reusable UI components

• Common styles and themes

• Utility functions

This approach reduces code duplication and ensures consistent UI across applications.

Technology Stack

• Framework: Angular 19.2.0

• State Management: NgRx Signals

• Package Manager: pnpm

• Styling: SCSS

• Authentication: Azure MSAL

Development Workflow

The development workflow is optimized for productivity:

• Each application can be run independently

• Shared libraries can be built in watch mode during development

• Scripts are available for common tasks (build, test, lint)