Reactive programming is a world on its own and is not necessarily tied to Angular. However Angular uses RxJS in
its APIs, so we must have a proper understanding of what it means to write reactive code. RxJS has a steep learning
But once you master it, there is no going back.
- What are Reactive Extensions
- Observable and Observer
- Cold versus Hot Observables
- Making Async Calls
- Combining Observables
- Error Handling
- Dealing with Back Pressure
- LAB - Spotify Search with Observables
This module will teach you about the internals of Angular. This knowledge is primarily useful for performance
debugging strange behavior.
- How Change Detection Works
- Immutables and Observables
- LAB - Optimizing Performance in an Angular Application
State management with NgRx
With the increasing complexity of client-side applications, a lot of state has to be kept. It's quite a challenge
all state consistent. Redux introduces a pattern to manage this state in a convenient way, while keeping your UI up
date as well. NgRx is the favorable implementation of Redux for Angular.
- The Redux Pattern
- Major Principles
- The Store, Actions and Reducers
- Using RxJS within Redux
- Efficient Slicing
- Using Async Pipes
The NgRx Store
- Normalizing Data
- Initializing the Store
- Useful Operators
- Splitting Up Reducers
- NgRx Effects
- LAB - Building a NgRx Store
Smart and Dumb Components
Should everyone be able to talk everything? No! Here we learn how to avoid chaos by splitting up our component
and dumb ones.
- Characteristics of Dumb Components
- Characteristics of Smart Components
- Performance Impact
- LAB - Integrating a NgRx Store into your Angular Application
Structuring an Application
Applications grow larger, code bases become unmanageable. Unless you structure them right.
- Domain, Routing, Core and Shared Modules
- Exporting and Providing
- Clean Imports
- Creating Libraries
- LAB - Structuring a more Complex Angular Application
Being able to dynamically add input elements to a form is incredibly useful for applications. This chapter looks
at how to do exactly that in Angular.
- Dynamically Adding Elements
- Nested Forms
- LAB - Forms array and nesting
Angular takes a lot of measures to make your app high-performant. But you can take it a bit further, especially
it comes to load times. In this Module you will learn about Ahead-Of-Time compilation and hot loading using Angular
Universal. Here you'll learn the difference between a good and a great application and how to please the elders of
- AOT versus JIT compilation
- Server-side rendering with Angular Universal
- Hot-Loading with pre-boot
General Principles of Unit testing
Every developer wants clean code that works. So how does one get to maintainable and working code? And
moreover: keep it working.
- What every developer wants: Quality code that works; and keeps on working
- Finding bugs: not just in code. - Or how NASA lost a 125.000.000$ Mars orbiter
- What is unit testing? And what is a good unit test?
- Understanding the difference between a unit test and an integration test
- Test Driven Development - Should you be doing it?
- Role-playing: Marge, Homer and Bart
- The Triple-A of unit testing - and what has cooking to do with this?
- Arrange-Act-Assert, or Given-When-Then?
- Testing dependencies - and the art of writing testable code
- Using fake objects, and the difference between a Stub and a Mock
How can we test Angular components, replace services as dependencies, build stubs and mocks? Here
we look at building component specifications using Jasmine and Karma.
- Writing Unit Tests with Jasmine
- Setting Up a Productive Testing Environment with Karma
- Writing Testable Angular Code
- Testing your Models, Services, Pipes, and Component Logic with Isolated Tests
- Angular Testing Utility APIs: Testing with the DOM in Mind
- LAB - Unit Testing in Angular
Custom Components with SVG and Canvas
Most Angular components are the result of slapping together a bunch of existing HTML elements. But what if you
something fundamentally new? In this topic, you will learn to draw exactly what you need by either using SVGs or a
- SVG Graphics
- Canvas Graphics
- Animating Graphics
- LAB - Building a Circular Progress Bar
Can I use my Angular component in a non-Angular environment like Drupal, SharePoint, WordPress and so on?
Well you can. Buckle up for a wild ride with Web Components and Angular Elements.
- Custom Elements
- Transforming Angular Components to Custom Elements
- Packaging and Using your Custom Element
- LAB - Using Angular Elements
So, you dipped your toes into the waters of Angular? Time to get your boots wet! This training will take you from
being an average Angular developer to a great one. You'll gain more insight in the workings of Angular and you'll
explore more advanced programming techniques like RxJS and working with Redux. Advanced Forms will hold no secrets
and you will acquire the assets to make your Angular application production ready. This course is constantly being
updated to the latest version of Angular, currently Angular 15.
This course targets professional web developers that really want to master Angular. Participants of this course
need to have a decent understanding of Angular and TypeScript. For developers who want to start with Angular development
U2U offers a 3-day course Building web apps with Angular and TypeScript.