Overview Angular Boot Camp is a live class for teams building complex applications, covering introductory topics through advanced solutions. 

Angular Boot Camp Outline

Introduction

1. Class Objectives and Roadmap
2. The How and Why of Angular

• Angular and the web platform
• Single-page apps (SPAs) vs traditional web applications
• Where Angular fits

1. The Angular Developer Experience

• Opinionated
• Performant
• Strict by default

1. Development Environment Setup
2. Class Materials Overview
3. Angular Application Essentials
4. Creating a New Angular Application

Components

1. Introduction to Components
2. Anatomy of an Angular Component
3. Defining a Custom Component
4. Displaying Data
5. Handling Events
6. Binding Data

• To properties
• To attributes
• To CSS classes and styles

1. Template Control Flow

• Conditionals - @if @else
• Loops - @for
• Switches - @switch
• Assignments - @let
• Legacy: *ngIf, *ngFor, *ngSwitch, etc.

1. Transforming Data with Pipes
2. Component Hierarchy

• Creating components with the Angular CLI
• Component hierarchy and the DOM
• Legacy: Angular Module

1. Component Inputs and Outputs
2. Component Patterns

Routing

1. Essentials of Routing
2. Configuring the Router

• HTML5 vs hash routes

1. Defining Routes

• Route Parameter

1. Lazy Loading

• Preloading

Services

1. Essentials of Services

• Why Services?
• Creating and Injecting Services
• Legacy: Angular Modules and Provider Definition

1. Sending and Receiving Data

• Intro to the Angular HttpClient
• Comparison to fetch, XHR

1. Intro to Dependency Injection

• Why DI?
• How DI is Used in Angular

1. Intro to Observables and RxJS
2. Using the async Pipe

Forms

1. Essentials of Form
2. Reactive Forms
3. Form Controls, Groups, and Arrays
4. Form Builder
5. Validation

• Built-in Validators
• Custom Validators
• Integrating Third-Party Validation Libraries

Application State & Data Flow

1. Component-local state (and its limitations)
2. Managing Application State

• With routes
• With services
• With NgRx and similar libraries

Signals

1. Essentials of Signals
2. The Basics of Change Detection
3. The Signals API - input(), output(), model(), etc.
4. Signals and Forms
5. Signals and RxJS

Testing

1. Unit Testing
2. End-to-End (E2E) Testing
3. Component Testing
4. Mocks and Spies
5. Asynchronous Testing

Advanced Reactivity

1. Beyond Observables
2. Promises
3. Integrating Signals, Promises, and RxJS
4. More Advanced Examples and Use Cases

• Observable composing and chaining
• Wrapping an API with observables
• switchMap() and friends
• Error handling
• Loading data with retry()
• Custom operators
• Integration with signals

Advanced Routing

1. Route Guards
2. Static and Async Route Data
3. Nested Routes
4. Auxiliary Routes
5. Preloading Strategies
6. Router Events
7. Tracing and Debugging
8. Advanced Configuration

Advanced Forms

1. Nested Forms
2. Custom Validators
3. Integrating Third-Party Validation Libraries
4. Dynamic Form
5. Custom Form Controls

Advanced Styling

1. Scalable and Maintainable Styling Architecture
2. View Encapsulation
3. Modern CSS

Additional Topics (Upon request, and as time permits)

1. Angular Material

• Setting defaults
• Customizing via Sass mixins
• Customizing via Material Design 3 theming
• Streamlining and reducing boilerplate

1. Nx DevTools
2. Advanced Security and Defensive Programming

• Sanitization
• XSRF

1. Advanced Accessibility Considerations
2. Internationalization and Localization
3. Content projection - ng-content
4. Using ng-container and ng-template
5. Deferrable Views - @defer
6. Custom Pipes
7. Advanced RxJS
8. Advanced State Management with NgRx
9. Advanced Dependency Injection

• Understanding constructor() vs inject()
• Multi-providers
• Injection tokens

1. Advanced Change Detection

• Zone.js default change detection
• OnPush change detection
• Signals

1. Directive Composition
2. Custom Directives
3. Template-Driven Forms

• Validator Directives
• Two-way data binding with ngModel

1. Component Lifecycle
2. Service Inheritance
3. Component Inheritance
4. Server-Side Rendering (SSR)
5. Dynamic Runtime Configuration

Have questions? Send us a message at training.na@valiantys.com. We're always happy to help!