1 of 13

2 of 13

Enhancing DSpace Angular with Nx

A Path to Modularization and Scalability

3 of 13

Current Architecture – Challenges

  • Monolithic structure with tightly coupled components
  • Difficult to isolate features or reuse code
  • Limited extensibility for external plugins

4 of 13

Vision – Library-Based Architecture

  • Inspired by DSpace Product Visioning Group discussions
  • Goals:
    • Modularize Angular codebase into reusable libraries
    • Enable external plugins to use core features independently

5 of 13

Introduction to Nx

  • Nx is a powerful open-source build system for monorepos
  • Supports Angular, React, Node.js, and more
  • Designed to improve developer productivity and code maintainability

6 of 13

How Nx Works in Angular Projects

  • Organizes code into apps and libraries
  • Provides powerful CLI tools for scaffolding and testing
  • Tracks dependencies and visualizes project structure
  • Supports incremental builds and caching

7 of 13

Benefits of Nx for DSpace

  • Modularization of core features and shared components
  • Simplified maintenance and upgrades
  • Improved extensibility for plugins and addons
  • Enhanced developer experience and onboarding

8 of 13

Nx Architecture Overview

  • Standalone structure: single app and libraries
  • Monorepo structure: multiple apps and libraries
  • Centralized configuration and tooling

9 of 13

Nx Workspace Structure

  • app/apps: contains Angular applications (e.g., dspace). Entry points for deployment
  • libs: reusable modules organized by domain or feature (e.g., core, config, utils)
  • nx.json: Nx-specific configuration
  • angular.json: Angular CLI configuration, splitted into project.json files for each project

10 of 13

Generating a Library with Nx

  • Command: nx generate @nrwl/angular:library core
  • Creates libs/core with module, service, and component
  • Encapsulates core logic for reuse across apps

11 of 13

Using the Dependency Graph

  • Command: nx dep-graph
  • Visualizes relationships between apps and libraries
  • Helps identify tight coupling and optimize architecture

12 of 13

Caching in CI/CD

  • Nx caches build and test results
  • Command: nx run-many --target=test --all
  • Speeds up CI pipelines by skipping unchanged tasks

13 of 13

Angular CLI Integration

  • Nx extends Angular CLI with generators and executors
  • Supports custom schematics for consistent scaffolding
  • Seamless migration from Angular CLI to Nx