You are the man! There is such a shortage of angular and angular related content on TH-cam. Especially content as good as this. Please keep up this good work. You’re really helping a lot!
@@ImperiumLibertas I have worked with angular for years, and I still think there are only better alternatives, like vue does better what angular does, svelte, react, basically everything is better and not as unnecessarily overcomplicated as angular. Rxjs is good though. Throwing around comments like "skill issue" is pretty dumb though, since you have no idea.
@@TastyTales792 funny because I've been in the industry for 7+ years you'd think I'd know a thing. Angular is fine especially in an enterprise environment. React is nice but jsx sucks imo but that's merely opinion. Remix is cool, Vue is cool, a lot of the 2017 era frameworks are falling out of date in favor for newer tech. Angular has amazing features like amazing DI, tooling, and makes the patterns extremely easy to follow especially when working with a team. The places Angular falls short is in the styling but that's not necessarily exclusive to Angular. And maybe you should qualify your position before just saying "angular is shit" and acting like your opinion is gospel.
Great videos and explanations - providing real world uses cases are some of the best parts of your videos. There is not enough of these types of videos with Angular and RxJS out there and you are providing a great service to the community with your videos and clear real world explanations!! Keep up the great work
Fantastic presentation! You definitely helped to clear the air with the differences between switchMap, concatMap, and mergeMap! Truly appreciate the effort here!
Excellent tutorial! I've always told people that rxJS always looks intimidating at first, but all you need to know are the basic operators and subject types. Those are the exact operators I use on a daily basis and I rarely deviate from them as well.
The video was great. Going to share it with my jr Devs. I really like that outro where streams don't do anything unless you subscribe. Teaching at every point, that was good.
Finally to see a video on rxjs where actually is explained that when you apply map operator and the values in the stream are each an array, if you want to modify each array you should do array.map in the map operator. I got it some years ago myself, but thank you that you start with this, because it's a key thing when beginning with rxjs.
Great explanation as always! The operators you showed are indeed those that we also use the most on our projects. I will share the link to this video with my colleagues who are still kinda new to RxJs so they can watch and learn at their own pace 🙂
cool video, I think there are more or less "common rxjs patterns" that we all use but we may not be using a "standard" approach with our implementations. Glad to see some real examples of yours to have as a reference!
I like rxjs and use it a lot when working on my side projects, but when working for my company I avoid creating long chains of it, it is hard for other people on the team and it is very hard for new joiners.
exhaustMap works better than switchMap for http calls when you're not able to cancel from server, because it will ignore subsequent calls, that's ideal for cases where the trigger is a button which an user can press quickly several times.
why not use `from` in front of the `map` operator, then `toArray()` to aggregate the xfm? If you need to process the array as an array in your stream first, you can just `switchMap` into the `from`... `concatMap` is great for enforcing synchronicity... but you have to ensure your observables actually complete... which (in certain scenarios) they'll stay open unexpectedly if you don't explicitely tell them to complete.
Great Content n Awesome way of explaining as always. Can u make a video on how to do @supercharge/promise-pool npm package like flow in Observable way . It would be great video to learn. It would be challenging for u n great learning for us 😉
Honestly, i did not even need most of them since the normal subscribing and emitting via next is in most cases enough. Because i dont need ttansform data often
hi, just fyI js is weird, you said array * 10 is NaN, but actually if you were to multiple for example [29] * 10, you would get 290, because if the element is of size < 2, it will convert the containing element to a number and use that as the value to multiply.
Hi, your real life example isn't clear to me - will this Observable produce value only when the whole list is updated? or it will give the latest previous value to the new Observable?
most likely, paying for soft gives you rights to use anytNice tutorialng included with your purchase as well as whatever the distibution rights of any tNice tutorialrd
How does Big O come into the picture? Does RxJs map work the same as array method(map)? If so, is it n2 with the example in this video. (map(x => x.map(n => n*10))
It's similar conceptually to the array method, but it's important to remember that the RxJS map operator operates on values emitted over *time*. For example, you might have an observable that just emits once, or you might have one that emits 'n' times synchronously, or you might have one that emits 'n' times but asynchronously over time (maybe it emits once every second, every 10 seconds, once every 10 minutes, and so on). Maybe you have an observable that emits infinitely over time. So if you're talking about synchronous emissions of observable values then you can probably just treat it the same way you would the array method for Big O, but for asynchronous values it's a bit different. It's also important to remember that the RxJS map operator is performed on the entire emission - so if you have an array that is emitted with 10 values, the RxJS map operator is run once (it is given the value of the entire array), and then the array method map will run 10 times (it is given each value in the array)
@@JoshuaMorony Thank you for the clear and concise explanation. Now that I have you here... would love more RxJS content in React. For example(Best Patterns, anti Patterns, testing, debugging, consuming APIs etc...). RxJS is a monster of a tool and it's recently picking up momentum in the industry. You are awesome explaining concepts and you would do an awesome job! Thank you for being awesome!!!
Great video! Do you think using take(1) is a valid operator to use in order to avoid the observable leaking when subscribed to? Instead of having to manually destroy the subscription later
Generally coding reactively in the style I'm talking about in this video means not manually subscribing to streams, you will generally just use the async pipe so there is no need to handle the subscription. However, there are still some cases where a manual subscribe might be required, and if take(1) makes sense for a particular circumstance then absolutely I don't have any problems with using that.
like the film, maybe add one extra in there, the shareReplay, it's quite easy and kind of helps with the data storing. Btw do you know what the difference is between the caching done by shareReplay and an Angular Service Worker, because the distinction isn't clear to me
I think a service worker will cache data permanently, so the data is still there when you restart the app. That's good for when you open the app and are offline. ShareReplay is caching data in memory and sharing it with multiple subscribers. So if you have multiple subscribers it won't refetch data from http (or whatever) multiple times when it doesn't need do. But It's cleared out once you close the app.
thanks for this great video. I have a question about compbining switch map with combine latest. In 16:50 of this video after changing the rount, lets say we haev a dynamic data from a socket.Io coming to one of the observers inside the combine latest. does it still work as the outer stream "rout param" doesnt change?
I do but they are from years ago, I am actually working around some NestJS stuff again now with Nx so at some point in the future I'll likely do some more modern NestJS vids
Hi Joshua, thanks for the vid. i have 1 question regarding switchMap. I have 2 observables A and B, Observable B will use data from Observable A and emit data to the screen. 1 thing is that whenever there is data change relating to Observable B, Osbervable B is not emitting the changed data because Observable A is the starting Observable. Is there any other way that i can do for this?
Join my mailing list for more exclusive content and access to the archive of my private tips of the week: mobirony.ck.page/4a331b9076
You are the man! There is such a shortage of angular and angular related content on TH-cam. Especially content as good as this. Please keep up this good work. You’re really helping a lot!
that's not a coincidence, angular is shit. :D but rxjs doesn't necessarily mean angular.
@@TastyTales792 naw, angular is an amazing framework. Probably a skill issue
@@ImperiumLibertas I have worked with angular for years, and I still think there are only better alternatives, like vue does better what angular does, svelte, react, basically everything is better and not as unnecessarily overcomplicated as angular. Rxjs is good though. Throwing around comments like "skill issue" is pretty dumb though, since you have no idea.
@@TastyTales792 throwing around comments like "shit" is pretty dumb though, since you have no idea.
@@TastyTales792 funny because I've been in the industry for 7+ years you'd think I'd know a thing.
Angular is fine especially in an enterprise environment. React is nice but jsx sucks imo but that's merely opinion.
Remix is cool, Vue is cool, a lot of the 2017 era frameworks are falling out of date in favor for newer tech.
Angular has amazing features like amazing DI, tooling, and makes the patterns extremely easy to follow especially when working with a team. The places Angular falls short is in the styling but that's not necessarily exclusive to Angular.
And maybe you should qualify your position before just saying "angular is shit" and acting like your opinion is gospel.
Great videos and explanations - providing real world uses cases are some of the best parts of your videos. There is not enough of these types of videos with Angular and RxJS out there and you are providing a great service to the community with your videos and clear real world explanations!! Keep up the great work
Fantastic presentation! You definitely helped to clear the air with the differences between switchMap, concatMap, and mergeMap! Truly appreciate the effort here!
Excellent tutorial! I've always told people that rxJS always looks intimidating at first, but all you need to know are the basic operators and subject types. Those are the exact operators I use on a daily basis and I rarely deviate from them as well.
The video was great. Going to share it with my jr Devs. I really like that outro where streams don't do anything unless you subscribe. Teaching at every point, that was good.
Finally to see a video on rxjs where actually is explained that when you apply map operator and the values in the stream are each an array, if you want to modify each array you should do array.map in the map operator. I got it some years ago myself, but thank you that you start with this, because it's a key thing when beginning with rxjs.
Great explanation as always! The operators you showed are indeed those that we also use the most on our projects.
I will share the link to this video with my colleagues who are still kinda new to RxJs so they can watch and learn at their own pace 🙂
cool video, I think there are more or less "common rxjs patterns" that we all use but we may not be using a "standard" approach with our implementations. Glad to see some real examples of yours to have as a reference!
You really just pulled off an eloquent and concise video talking about rxjs operators...
Thanks a lot for pushing this sort of content on TH-cam bro. Angular material is by far very less and such content helps us. Keep up the good work
Your tutorials are so useful and your presentation style is very engaging 👍
Thank you so much! It can't be much clear than you explained it, been using CatchError the wrong way until today!
thanks you so much, i saw alot of videos about rxjs but all of tham didnt help me.
your video is the best to understand how to use it and why.
Omg this the the 10th time i watched this video. Rxjs is just overwhelming for new comers like me. Thank you very much my man
Super cool video and a competent explanation! Think I finally got switchMap fully understood.
Wish I discovered you way earlier!
Joshua, very good tutorial. Well explained. I've learned a lot from you! And you've got an Aussie accent, which is a plus! ;)
Finally got the SwitchMap.. Great video great explanation
Hi Josh, you could use vm in parent container using rather than calling async multiple time as it will cause multiple subscriptions.
Thank you for this tutorial , I finally understood RxJS operators!
The best channel I have seen so far. thanks a lot
Thanks for the free software, it makes your search a lot easier
BROTHER, YOU ARE THE BEST!!! You oooh really helped me!! THANK YOU VERY MUCH!This is cool, well done!
Great video! Thanks for teaching us the most common operators you use :)
Awesome video! Thanks, Joshua!
Extraordinary explanation man ❤
Your videos are so good explained and useful for understanding ngrx. Thank you so much for this!!🧡🧡
Thanks, it was interesting, would watch any other operators as well.
Thank you!!!! This is a wonderful explanation. I appreciate the detailed explanation.
This is so useful for an rxjs beginner (like myself)
More examples!! More examples!!!
Pure gold, thanks for sharing!
Great Video, thank you very much!!
You are a great teacher. Well explained!
Very helpful thanks!!!
Great video! Clean with real life examples.
Great tutorial thank you so much
great video man! thank you so much for it!
I realize Im coding it wrong the whole time. Thank you for a great explanation!
Awesome video thanks
Hey I think typing the return value of you functions would help understand at a glance what will be returned in the end. Great video though!
Thank you Joshua!
thank you for your videos. You are awesome!
good job man
I would have understood RxJS better if I had met you earlier.
Great video thanks so much 🙏
Thank youu!! :D
Great video, surely it is helpful.
I like rxjs and use it a lot when working on my side projects, but when working for my company I avoid creating long chains of it, it is hard for other people on the team and it is very hard for new joiners.
I hope you get what you're looking for!
exhaustMap works better than switchMap for http calls when you're not able to cancel from server, because it will ignore subsequent calls, that's ideal for cases where the trigger is a button which an user can press quickly several times.
why not use `from` in front of the `map` operator, then `toArray()` to aggregate the xfm? If you need to process the array as an array in your stream first, you can just `switchMap` into the `from`...
`concatMap` is great for enforcing synchronicity... but you have to ensure your observables actually complete... which (in certain scenarios) they'll stay open unexpectedly if you don't explicitely tell them to complete.
I just found his exponation rather hard to understand, but at least I have a general idea of what operators to look up in the future.
Can you make more in details? Here you just showed the code.
some of those operators are very similar in name and what the do with higher order functions in JS.
So much value in this video. Keep going!
Great Content n Awesome way of explaining as always. Can u make a video on how to do
@supercharge/promise-pool npm package like flow in Observable way . It would be great video to learn. It would be challenging for u n great learning for us 😉
Honestly, i did not even need most of them since the normal subscribing and emitting via next is in most cases enough. Because i dont need ttansform data often
Great tutorial again, do you have place where we can check your code, what is the advantages of iconic and how to set it up ?
tap operator not executed when subscribe not done ?
Great content. Would you plan to create mini projects for angular using reactive programming ??
hi, just fyI js is weird, you said array * 10 is NaN, but actually if you were to multiple for example [29] * 10, you would get 290, because if the element is of size < 2, it will convert the containing element to a number and use that as the value to multiply.
am i correct in my thinking that combineLatest is NOT a good choice if the 2nd call depends on a value from the data returned by the first call?
For so wierd reason when I try to use the GMS it just make one loud noise..
Hi, your real life example isn't clear to me - will this Observable produce value only when the whole list is updated?
or it will give the latest previous value to the new Observable?
most likely, paying for soft gives you rights to use anytNice tutorialng included with your purchase as well as whatever the distibution rights of any tNice tutorialrd
Bartell Ports
How does Big O come into the picture? Does RxJs map work the same as array method(map)? If so, is it n2 with the example in this video. (map(x => x.map(n => n*10))
It's similar conceptually to the array method, but it's important to remember that the RxJS map operator operates on values emitted over *time*. For example, you might have an observable that just emits once, or you might have one that emits 'n' times synchronously, or you might have one that emits 'n' times but asynchronously over time (maybe it emits once every second, every 10 seconds, once every 10 minutes, and so on). Maybe you have an observable that emits infinitely over time. So if you're talking about synchronous emissions of observable values then you can probably just treat it the same way you would the array method for Big O, but for asynchronous values it's a bit different. It's also important to remember that the RxJS map operator is performed on the entire emission - so if you have an array that is emitted with 10 values, the RxJS map operator is run once (it is given the value of the entire array), and then the array method map will run 10 times (it is given each value in the array)
@@JoshuaMorony Thank you for the clear and concise explanation. Now that I have you here... would love more RxJS content in React. For example(Best Patterns, anti Patterns, testing, debugging, consuming APIs etc...). RxJS is a monster of a tool and it's recently picking up momentum in the industry. You are awesome explaining concepts and you would do an awesome job! Thank you for being awesome!!!
Great video! Do you think using take(1) is a valid operator to use in order to avoid the observable leaking when subscribed to? Instead of having to manually destroy the subscription later
Generally coding reactively in the style I'm talking about in this video means not manually subscribing to streams, you will generally just use the async pipe so there is no need to handle the subscription.
However, there are still some cases where a manual subscribe might be required, and if take(1) makes sense for a particular circumstance then absolutely I don't have any problems with using that.
You should map your params to the id before the switch map rather than look up the id from the params for every iteration of the find.
like the film, maybe add one extra in there, the shareReplay, it's quite easy and kind of helps with the data storing. Btw do you know what the difference is between the caching done by shareReplay and an Angular Service Worker, because the distinction isn't clear to me
I think a service worker will cache data permanently, so the data is still there when you restart the app. That's good for when you open the app and are offline.
ShareReplay is caching data in memory and sharing it with multiple subscribers. So if you have multiple subscribers it won't refetch data from http (or whatever) multiple times when it doesn't need do. But It's cleared out once you close the app.
Tremayne Valleys
have too many proprietary restrictions on the user and I want more freedom in importing and exporting projects, soft and video editing
Carolanne Meadows
Aurelio Isle
just wow
Lopez Matthew Hernandez Jessica Robinson William
thanks for this great video. I have a question about compbining switch map with combine latest. In 16:50 of this video after changing the rount, lets say we haev a dynamic data from a socket.Io coming to one of the observers inside the combine latest. does it still work as the outer stream "rout param" doesnt change?
Yes, combineLatest will continue emitting values if the input observables emit, the switchMap from some other observable won't prevent that
Wilson Patricia Moore Scott Johnson Jose
Williams Steven Jones James Martinez Jose
Can we have access to the github repo with your examples?
Sorry Pedro, usually I would but these examples are all scattered across various projects I am working on that aren't public at the moment
Wilson David Martin Christopher Lopez Laura
Even a basic tutorial video is pretty much too complicated. I've just accepted I'll never make a soft using soft soft
Gonzalez Brian Moore Scott Wilson Robert
Martinez Elizabeth Anderson Richard Williams Michael
Walker Deborah Hall Jason Lopez Steven
Hernandez Elizabeth Miller Christopher Thomas Margaret
Do you have some nestjs vids?
I do but they are from years ago, I am actually working around some NestJS stuff again now with Nx so at some point in the future I'll likely do some more modern NestJS vids
Taylor Steven Clark Daniel Walker Edward
Garcia Margaret Garcia Christopher Johnson Christopher
Garcia Linda Rodriguez John Allen Sandra
Wilson Jennifer Young Edward Taylor Michael
Mayert Brook
Johnson Maria Perez Jason Hernandez Linda
Davis Daniel Anderson Sharon Lewis Maria
Harris Robert Taylor Richard Garcia Thomas
Hi Joshua, thanks for the vid. i have 1 question regarding switchMap. I have 2 observables A and B, Observable B will use data from Observable A and emit data to the screen. 1 thing is that whenever there is data change relating to Observable B, Osbervable B is not emitting the changed data because Observable A is the starting Observable. Is there any other way that i can do for this?
Perez Dorothy Walker Mark Young Anthony
Thomas Robert Jackson John Walker Patricia
You can do 99% of the work with filter, tap, map, switchMap, combineLatest, of, untilDestroy, catchError