Workshops Package
Scalable Architecture & Modern Reactivity + Signal Forms

Agenda

Day 1. Scalable Architecture & Modern Reactivity

• Date: 09.10
• Duration: 8 hours
• Workshop Lead: Fanis Prodromou (GDE)

1. 01

   Nx Architecture: Building Scalable Monorepos

   • The Modulith Pattern – Organize apps into self-contained “Moduliths” for scalability.
   • Layered Architecture – Master separation of concerns using Feature, UI, and Data-Access layers.
   • Workspace Mastery – Efficiently manage the apps vs libs structure using the CLI and Console.
   • Lazy Loading – Configure clean routing using Feature Libraries as entry points.
2. 02

   Enforcing Boundaries & Visualizing Dependencies

   • Dependency Graph – Visualize architecture and data flow in real-time with nx graph.
   • Affected Analysis – Identify exactly which projects are impacted by code changes.
   • Architectural Rules – Use tagging and ESLint constraints to prevent circular dependencies.
   • Intentional Failure – Debug linter errors to understand strict code boundary enforcement.
3. 03

   Signals Core & Fine-Grained Reactivity

   • Signal Fundamentals – Master the basics of signal() vs variables vs Observables.
   • State Derivation – Use computed() for automatic, memoized state calculations.
   • Side Effect Management – Manage DOM updates and logging cleanly with effect().
4. 04

   Advanced Signals & Data Flow

   • Declarative I/O – Implement the modern input() and output() APIs.
   • Resettable State – Manage derived state updates with linkedSignal.
   • Async Data Flow – Handle async loading states using rxResource or toSignal.
   • Signal Forms – Build reactive forms using the experimental form() API.

(NEW) AI topics

1. 01

   Workspace Intelligence & The “Context Gap”

   • The “Context Gap” Explained: Why standard, text-only prompts fail in monorepos because they see individual files but miss the high-level architecture.
   • Instant Architectural Understanding: Using the nx graph as a “Source of Truth” to feed AI agents a structured map of 150+ libraries.
2. 02

   Framework Intelligence: Signals & Angular MCP

   • Powering Modern Angular: Installing framework-specific Agent Skills and MCP Servers.
   • The Synergy Model: Using Nx as the “Map” to find code and the Angular MCP as the “Expert Tools” to refactor it.
   • Future-Proofing the Stack: Using automated tools to modernize legacy code and stay up to date with modern reactivity.
3. 03

   AI-Assisted Signal Migrations

   • Automated Refactoring: Using AI to safely convert legacy RxJS streams and @Input() decorators into modern Signals, input(), and output() APIs.
   • Zoneless Readiness: Delegating the heavy lifting of state migration to agents that respect your workspace’s Architectural Guardrails and Tags.
   • Safe Scaffolding: Using the nx-generate skill to create new features with signal-based boilerplate automatically.
   • Workflow Blueprints: Real-world examples of automated discovery, architectural auditing, and mass Signal migrations.

Day 2. Signal Forms

• Date: 12.10
• Duration: 8 hours
• Workshop Lead: Mateusz Stefańczyk (GDE)

1. 01

   Foundations

   • Welcome & Introduction
   • Reactive Forms vs Signal Forms – pain points solved, migration strategies, when to use each
   • Signal Forms Syntax & Fundamentals – form models, field trees, [field] directive, two-way binding
2. 02

   Form Architecture

   • Working with Form Models – reading/updating models, nested structures, arrays, dynamic fields
   • Custom Form Controls – reusable components, integration patterns
   • Advanced Validation – custom validators, cross-field validation, async validators, error handling
3. 03

   Scalable Architectures

   • Schema-Based Forms – reusable schemas, composition patterns, type-safe design
   • Enterprise Patterns – form orchestration, sharing schemas, state management integration
4. 04

   Production Ready

   • Best Practices & Performance – model design, initialization strategies, optimization techniques, testing
   • Real-World Case Study – complete feature walkthrough, API integration
   • Q&A & Wrap-up

Your Trainers

Mateusz Stefańczyk

Google Developer Expert

For 9 years, Mateusz has been developing web applications with Angular. He has performed dozens of audits for Angular projects worldwide. Mateusz actively participates in the angular.love community, writing expert articles, and sharing his knowledge at Angular meetups in Poland, Norway, Germany, and the UK.

Fanis Prodromou

Google Developer Expert

Google Developer Expert (GDE) for Angular and Senior Front-End Developer. He is passionate about sharing his knowledge through his YouTube channel, speaking at conferences and meetups, and technical articles. He also stays current in the ever-evolving tech world by attending conferences and experimenting with new technologies, and is a co-organizer of the Angular Athens meetup in Greece.

Get your tickets

Join us for an online workshop. Secure your spot today!

FAQ