Reactive Angular with NgRx

Further Refactoring and Q&A

Reactive Angular with NgRx

Check out a free preview of the full Reactive Angular with NgRx course

The "Further Refactoring and Q&A" Lesson is part of the full, Reactive Angular with NgRx course featured in this preview video. Here's what you'd learn in this lesson:

A question is asked regarding how to handle a sequence, and Lukas explains how the application could be further refactored.


Transcript from the "Further Refactoring and Q&A" Lesson

>> Lukas Ruebbelke: With that said, does anybody have any questions about what we're doing? With an event coming in, the asynchronous thing being captured by the effect. And then once it's done, it's basically just patching a new action event to be captured in the reducer.
>> Lukas Ruebbelke: Yes?
>> Speaker 2: The question, how would handle that sequence?

So say you had to go to one service to get it then, and then call another service, and call another. Like so you have like three in a row and they're always serial, how would you handle that?
>> Lukas Ruebbelke: So, very good question. Now let's say, and I've done this, like AddProject.

Instead, what I wanna do is rehydrate. So I want to add, especially if you have more than one person working on it. And you might say, I'm gonna create this but because I'm mutating the database. And I know that there's some changes, I just want to go ahead and do a refresh which is viable.

What I would do down here is instead of saying, okay, I'm going to dispatch, so add projects, so we've added it. I would do, new LoadProjects. And so now what happens, you create the project. So it comes in, it completes, and then it dispatches a new action which then gets picked up over here and does something else.

And so now this is the beauty, remember we talked about managing state, control flow and code volume. And this is a really powerful way to sequence events together. And what's nice is that this is happening in one place like the load project sequence. But then, I can put that in the end of like add projects.

And so now, and you don't even need to do like asynchronous thing but you can just essentially have at the end of your effect sequence, dispatch another action which gets picked up by a new effect sequence. And, you know, start to stack these kind of Standalone encapsulated pieces of control flow.

So in my mind that if the reducer and the storage for state management affects are there for flow of control. So, it's a very good question and that's something that I've done with actually sequence events together. Where I've chained like two or three of them together.
>> Lukas Ruebbelke: Any other questions, what does everybody think about this, pretty neat?

Think it's pretty cool, especially now our services, they're doing one thing. Like our HTTP service, they're making server side calls. Then, and so I will show something else is that if we look in the projects service, possibly what I may even do is you see how here we're kind of fiddling around and this is okay but more than likely I would move this into an effect as well.

And so if I were to even take another pass at this and refactor this, this right here would more than likely be moved into an effect because this is, it's not really necessary, I can say. Load the customers then do this and then just chain them together.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now