Lesson Description
The "Custom Features" Lesson is part of the full, Advanced Angular: Performance & Enterprise State course featured in this preview video. Here's what you'd learn in this lesson:
Alex shows how to extend SignalStore with custom features, demonstrating how to enrich state, computed, and methods while keeping the store simple and flexible.
Transcript from the "Custom Features" Lesson
[00:00:00]
>> Alex Okrushko: Signal, as you might have noticed, signal store here is like this with state provides the signal store feature, which is good, right? And with computed. What does it do? It basically provides a signal store feature. And with methods. You're probably guessing it correctly right now. It provides a signal store feature. And it's not by accident.
[00:00:35]
It's a lot of typing signal store feature, and it's not by accident. So what signal store in fact doesn't really care what you provide, what state, what computer, to which order I can have more with state here. Some, I don't know, T-books or something, it doesn't matter, so, but the only thing I'll just do without the state, so I can do them as many as one combinations of what I won't recommend doing that, but the main idea is, what if you create your something your own that just adheres to that interface, wouldn't that be cool?
[00:01:13]
That's what we call custom features, and this extensibility is what completely got me on, so like, yeah, we need to do to release this thing, 100%. So, you can have some feature, for example. Function, you can call it with, I don't know, some feature. This is very creative. With some feature. And what we're going to return here is, signal, signal store feature.
[00:01:52]
And this is just a helper wrapper, and now within the signal store feature, we can create our own whatever state or just computed or just methods, whatever you want to do, you can create here with state, for example, I'll just have. My future. String or string which should be that's right, and I might want to have them with computed.
[00:02:23]
Return, not, I don't really care, I do care because I have to depend on this, my feature can extract that and return the new object of. Plus something plus I'll be. My future plus. Another feature. Doesn't matter, the idea is that we provide some computer. Now I can plug this in into my signal store. For example, here. And now it enriches my signal store with that feature, for example, in here in my store, I can access my feature or my plus, so I can have methods and stuff like that.
[00:03:27]
This is like the amazing superpower and in fact, if you look at the implementation of the signal store. It's 20 lines of code. Let me just get this one. In. Platform Yeah, again, seeing is believing, right? So we're going to go modules. I'm going to go signals going to go source and you're going to go signal store. So it has 800 lines of typing.
[00:04:05]
So all of this is just typing, all of that was strict typing. At the end of the day, it just takes a bunch of those signal store features. Checks, for config, if it has the config as the first argument, then what it does inside it creates the class with this config, if you have provided or not, so within this function. It creates the class, that's injectable.
[00:04:33]
Right, and then the constructor sees these features reduced, which is array reduced, and basically rolls this feature one into another. Alright, and then, add some properties, methods and that's it, if it also looks, hey, do we have hooks, because hooks are a little bit special and this is on the knit or on destroy, Melissa for the destroy and return that class.
[00:05:02]
It creates this class. Doesn't even knew it, right, it's really just creates a reference. That's it, it's like what, 20-30 lines of code, so what it does. Super powerful, and simplicity is the beauty here. So it is super powerful, does a lot of things. Yes, so here we go. And again now with the some feature, I did, I showed you that.
[00:05:34]
All of those things are available here too, right, this bookstore, like my feature plus whatever other methods. And we're going to use this in our course today, but. This is a very brief overview of the signal store, we're going to see some other helpful for methods, and we're going to utilize how we handle race conditions within the signal store, again, it's very beautiful, I think.
Learn Straight from the Experts Who Shape the Modern Web
- 250+In-depth Courses
- Industry Leading Experts
- 24Learning Paths
- Live Interactive Workshops