NgRx In One Day Workshop

Learn the basics of NgRx in one day from the co-creators of NgRx in this accelerated workshop.

01. Build reactive applications in Angular with NgRx
NgRx enables you to build applications that react to new state that is pushed into the Store. Combined with the power of RxJS our applications can efficiently provide a rich user experience.
02. Demystify NgRx - you already know NgRx!
Angular components have inputs and output, handle state transitions, and perform side effects. Using this same mental model we can start to understand NgRx.
03. Event storming and good action hygiene
Event storming enables you to start designing the actions as a result of events in your application before writing a single line of code. Combined with good action hygiene and you'll be building performant, and easy to debug, Angular applications with NgRx.
04. Handle state transitions
You'll learn how to define reducers to immutably producing new state. You'll also learn that reducers are pure functions, so we'll never perform any side effect in our reducers.
05. Compose selectors
Defining and composing selectors enables you to efficiently query for data in the Store.
06. Perform Side Effects
The Effects library from NgRx enables you to perform a side effect as a result of a dispatched action. You'll be using effects to load data from services into the Store.

Pricing

Transparent and simple pricing to skill up your team.

$2,400

Reactive Programming in Angular
Demystifying NgRx
1. You already know NgRx!
2. NgRx mental model: state flows down, changes flow up
3. Single responsibility principle
4. Indirection between consumers of state, how state changes, and side effects
5. Select and dispatch are special version of @Input() and @Output()
6. Delegate responsibilities to individual modules of code
NgRx Actions
1. A unified interface to describe events
2. Just data, no functionality
3. Has a type property at a minimum
4. Good action hygiene
5. Event storming
Reducers
1. Reducers produce new state
2. Reducers receive the last state and next action
3. Reducers listen for specific actions
4. Reducers are pure function that perform immutable operations
5. Setting up the Store
Selectors
1. Selectors allow us to query for data
2. Selectors are recomputed when their inputs change
3. Leverage memoization for performance
4. Selectors are fully composable
Effects
1. Effects are processes that run in the background
2. Effects connect your app to the outside world
3. We often use effects to talk to services.
4. Effects utilize an RxJS actions stream.

Attendees should be familiar with the following technologies:

Can't find the topic you are looking for? Contact Us to learn about our custom training solutions.