Training Program

Angular Training Program

Master Angular from fundamentals to advanced concepts with our comprehensive curriculum covering Angular 21, TypeScript, RxJS, and modern best practices.

Components

Master the fundamentals of Angular components by understanding their structure, styling options, and how they work together to build applications. In this chapter, you'll explore: • The three essential elements every Angular component requires • How to use the @Component decorator to provide metadata • Different ways to style your components with inline or external styles • How to import and use components in your application • Understanding the component hierarchy and key terminology like host elements and views

2h40

Templates

Master Angular's template syntax to build dynamic and interactive user interfaces with data binding, event handling, and control flow. In this chapter, you'll explore: • How Angular templates extend HTML with special syntax and capabilities • Data binding techniques for connecting dynamic data to DOM elements • Event handling to respond to user interactions • Control flow structures for conditional and repeated content • Template syntax features including pipes, variables, and special directives

2h20

Directives

Add behavior to the DOM with Angular directives: built-in, attribute and structural directives, the Directive Composition API and NgOptimizedImage.

1h

Dependency Injection

Master Angular's dependency injection: services and providers, injection contexts, hierarchical injectors and DI debugging.

1h30

Router

Build navigation with the Angular Router: defining routes, lazy loading, outlets, guards, resolvers, route state and testing.

3h

Form

Handle user input with Angular forms: reactive, typed, template-driven and signal forms, validation and dynamic form building.

2h40

Http

Talk to backends with Angular's HttpClient: making requests, httpResource, interceptors and testing HTTP calls.

1h10

Performance & Server-Side Rendering

Learn how to optimize Angular application performance using server-side rendering, hydration, and advanced rendering strategies

50 min

Signals

Learn about Angular Signals, a reactive primitive for managing state and tracking dependencies throughout your application

50 min

Testing

Comprehensive guide to testing Angular applications including components, services, directives, pipes, and advanced testing techniques

2h50

Internationalization (i18n)

Learn how to make your Angular application available in multiple languages using Angular's internationalization features

2h

Animations

Learn how to create engaging animations in Angular using CSS animations and route transitions

30 min

Drag and Drop

Learn how to implement drag and drop functionality in Angular using the Angular CDK

20 min

Performance

Master Angular runtime performance optimization techniques, including change detection strategies, zone pollution prevention, and best practices for building fast, responsive applications.

1h10

Best Practices

Master Angular development best practices including coding style, security, accessibility, error handling, and keeping your applications up to date with the latest Angular features and improvements.

1h

Angular CLI

Master the Angular Command Line Interface (CLI) - the essential tool for scaffolding, developing, testing, deploying, and maintaining Angular applications from the command shell.

2h40

RxJS

Master reactive programming with RxJS, the powerful library for composing asynchronous and event-based programs using observable sequences. In this chapter, you'll explore: • Understanding Observables and the Observer pattern • Working with operators to transform, filter, and combine streams • Managing subscriptions and preventing memory leaks • Using Subjects for multicasting • Controlling execution with Schedulers • Testing reactive code with marble diagrams

1h20

NgRx - Store

Learn NgRx, the reactive state management library for Angular applications based on Redux patterns.

3h

NgRx - Effects

Handle side effects in NgRx with @ngrx/effects: isolate async work, react to actions, and test effect streams and their lifecycle.

1h

NgRx - Signals

Manage state reactively with @ngrx/signals and SignalStore — computed state, entities, custom features, RxJS integration and testing.

3h

NgRx - Entity

Manage collections efficiently with @ngrx/entity: adapters, normalized state and CRUD updates wired into your feature stores.

1h10