Top 5 Angular Mistakes - You Must Know Them

  Рет қаралды 60,815

Monsterlessons Academy

Monsterlessons Academy

Күн бұрын

Пікірлер: 161
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
WATCH NEXT: Angular Interview Questions and Answers - Dominate Your Next Interview - kzbin.info/www/bejne/a3LCin6ii7yAhtEsi=2DCn7yspEAAJ2H6l
@TD-sh6wd
@TD-sh6wd 2 жыл бұрын
My Problem with the Streams, Is how do I catch Error, just use try catch? to promise it seems easy, just .catch you get the error, but in these it seems different
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
@@TD-sh6wd Just use catchError www.learnrxjs.io/learn-rxjs/operators/error_handling/catch
@kumailn7662
@kumailn7662 2 жыл бұрын
title of the video should be "top 5 mistake developer makes in angular"... its not angular mistakes
@starlite7249
@starlite7249 3 жыл бұрын
0:10 Subscribe Instead of Streams 4:26 Unsubscribe 5:33 Not Enough TypeScript 6:47 God Object Modules 7:49 Performance: TrackBy
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Thanks a lot!
@d.bachmann6798
@d.bachmann6798 Жыл бұрын
Have watched several videos with this Author (name?). This is something real high quality. I am an experienced programmer and have even worked with Angular for some time and still this was very much worth watching. He has a God given talent of making coding videos. This series should have 1000s of likes.. really amazing well explained . Very well edited everything is not too long and not too short.. It is a real pleasure to watch and learn from. Also by following these videos you pick up good coding practices with an understanding of why!
@Matrium0
@Matrium0 2 жыл бұрын
About the first point: the use of streams and async-pipe is really nice - UNTIL you realize that there is a thing called "error handling"! It's save to save that you want some sort of error handling in every single async call - at the very least this will reset your "loading"-indicator (like a spinner), but it might also display proper messages to the user. This is were async gets ugly - very badly so - you need a second stream, operators to share the original subscription and so on. You CAN do it, but in the end it does get quite bloated. Please show the ugly parts as well when recomending async-pipes. Other than that: nice video!
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Hi thanks for your comments but it sounds like your architecture is not correct. isLoading$ stream doesn't know anything about errors and it should not. errors$ is rendered when we got errors and saved them in state. What you wrote is promise approach when you need to render something when you get an error. You need to separate fetching/errors from state rendering. Then you won't have problems.
@Matrium0
@Matrium0 2 жыл бұрын
@@MonsterlessonsAcademy I will try to explain better: A real world example would usually at least have a loading-spinner to show the loading process and would have to catch and display potential errors in some way, doesn't it? What happens if your this.userService.getUsers() function actually throws an error? Let's say because you lost your internet connection for a minute. My point is that async is only THAT beautiful if you neglect error handling - once you add that it get's pretty ugly - especially if you want to handle it fully reactive.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
The simplified variant is this: this.userService.getUsers().subscribe() => { next: () => this.isLoading$.next(false), error: (err) => this.error$.next(err.message) } And we render {{isLoading|async}} {{error|async}}
@yevhen3934
@yevhen3934 3 жыл бұрын
It's a good tips. Oleksandr, I have a question to you: why do we initialize our values ​​in the constructor and not in the lifecycle hook OnInit? Because ngOnInit was created just for this. Isn't it bad code style to push variable initialization into a constructor?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Yes you are write. onInit is "better" because it's an Angular life cycle hook and constructor is a default behaviour of the class. The main problem with strict typescript you get error that your values doesn't have initializer when you write isLoading$: Observable | undefined ngOnInit() { this.isLoading$ = this.store.select(isLoadingSelector) } and you get all boring undefined checks in your component. When you write assignment in constructor TS doesn't scream because it's a default value and it can never be undefined.
@yevhen3934
@yevhen3934 3 жыл бұрын
@@MonsterlessonsAcademy , you're right. Thanks!
@krzysztoftokarz3684
@krzysztoftokarz3684 2 жыл бұрын
@@MonsterlessonsAcademy actually it can be resolved like this sLoading$!: Observable; ngOnInit() { this.isLoading$ = this.store.select(isLoadingSelector) }
@love-hammer
@love-hammer Жыл бұрын
This is actually just a common pattern when using DI (following SOLID principles is not a bad practice). It's important to keep in mind why _change detection_ lifecycle hooks exist: There's something we want to happen in the template at the appropriate time. ngOnInit was created to initialize "all data-bound properties of a directive", but it's called _after_ object construction.
@yanmoenaing8267
@yanmoenaing8267 Жыл бұрын
Thanks. These are the mistakes I've been doing for the last 4 months since when I started writing Angular code.
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
You are welcome!
@abhisheksaxena518
@abhisheksaxena518 2 жыл бұрын
Thanks for pointing the common mistakes and giving detailed solutions for each of them, helped me a lot! Subscribed
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Thanks for the sub!
@rhnkashyap
@rhnkashyap Жыл бұрын
Please use the async pipe xD
@joeyvico
@joeyvico 2 жыл бұрын
Using the async pipe method how would you handle errors? Maybe my question is too broad and requires its own tutorial which would be very welcome. Thanks for the video
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Typically you have 2 async pipes for data and for error. You either fill data stream or error stream,
@krzysztoftokarz3684
@krzysztoftokarz3684 2 жыл бұрын
there is an rxjs operator for this - catchError
@abdulnafay72
@abdulnafay72 Жыл бұрын
@@krzysztoftokarz3684 isn't it deprecated
@shivajimore4269
@shivajimore4269 Жыл бұрын
Thanks for these helpful tips, what if I used track by index instead of creating function inside component?
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
What is track by index?
@rajtilak029
@rajtilak029 6 ай бұрын
Thanks, this video helped me understand the angular design pattern better.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 6 ай бұрын
Glad it helped!
@mapiideal
@mapiideal 3 жыл бұрын
For the second problem: you don't need unsubscribe subscription from http client requests. These are single subscription and are cleaned up by the http client itself.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
You are totally write but nobody knows what is inside service. It might be not http. I prefer to always unsubscribe from all subscribes to be on the safe side.
@sugiono2801
@sugiono2801 3 жыл бұрын
@@MonsterlessonsAcademy should i use it for unsubscribe angularfire ?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
@@sugiono2801 I would unsubscribe from any subscribe in my app just to be on the safe side.
@tranhuuthu991990
@tranhuuthu991990 2 жыл бұрын
http emits once and complete or error. So no need to unsubscribe, please refer to angular document. the same for routing and its observables.
@hisoka500
@hisoka500 2 жыл бұрын
When i work with behaviour subject i need to unsubscribe likr you but i love the obsevable way nice bro
@azzounimourad7112
@azzounimourad7112 28 күн бұрын
Thanks for your tips and advices , i really use those mistakes , i'm still beginer in using Angular , and for the first point if i use it as stream and call it in the constructor , and assume that i want to use the list of users in other functions in that component how do i manage to do it without subscribing to that observable or stream , thanks a lot , the other points are very helpfull
@MonsterlessonsAcademy
@MonsterlessonsAcademy 28 күн бұрын
You either use an async pipe or a subscribe. There is no other way
@azzounimourad7112
@azzounimourad7112 27 күн бұрын
@@MonsterlessonsAcademy thanks for your answer sir
@ghkpr
@ghkpr 2 жыл бұрын
thanks a lot for your videos, easy to understand straight to the point. I'm transitioning from react, they helped a lot!
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
You are welcome!
@MrFreddao
@MrFreddao 2 жыл бұрын
Thanks my friend, GREAT video. Thanks a LOT.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Glad you enjoyed it!
@MrMaxxx45
@MrMaxxx45 2 жыл бұрын
I'm coming from a React background and now am starting to learn Angular and I most say these subscription feel unnecessary to use everywhere. They are very useful when data gets updated again and again like a stream. But when I just want to fetch a single value from the api.. why do I need to subscribe to it. A promise is all I need. I turned to using the firstvaluefrom from rxjs in the service and turning the requesting method in the component into a async method. Now I can utilize async/await and try catch blocks . I don't know if it's wrong, the reason "it is the angular way" is not really an answer. Angular has changed it ways allot with every update.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
I agree with you. When we fetch data it doesn't make a lot of sense of stream. But the idea is that everything is a stream: DOM events, API calls, data streams. Then it is much easier to combine this data. If you convert it to promise you can't combine it.
@Thon-Diego
@Thon-Diego Жыл бұрын
cool video mate, i havent used the trackby function!
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
You should!
@qwerty123246
@qwerty123246 Жыл бұрын
Thanks a lot man, that's really helpful stuff
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
Glad it helped!
@BlockCylinder
@BlockCylinder 2 жыл бұрын
I'm humbled and inspired.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Awesome!
@thezachmurray
@thezachmurray 2 жыл бұрын
This has really helped correct some of my mistakes, thank you. Please, I must know, What font are you using in the editor?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
You are welcome! It's monaco font.
@ugochukwuumerie6378
@ugochukwuumerie6378 2 жыл бұрын
Wow! This is really helpful 👌, thanks for sharing. I'm guilty of subscribe instead of stream, I can only use it effectively when I want to fetch data, but how do I use streams for updating, deleting and creating data or generally CRUD operations? Thanks
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
You can learn more about streams, RxJS in my course as we have lot's of crud operations there. kzbin.info/www/bejne/eqrOnaukeJeLhpI
@mahmoudmohamed-xu2lb
@mahmoudmohamed-xu2lb 5 ай бұрын
thanks for your videos when we use stream instead of subscribe what if we need to make loading or error happened how to handle this
@MonsterlessonsAcademy
@MonsterlessonsAcademy 5 ай бұрын
It depends. Something still needs to read a stream. Either a subscribe or async pipe. If you want to handle error you can use catchError function. Loading it typically a separate stream, or a stream which returns loading status.
@CodingAbroad
@CodingAbroad 2 жыл бұрын
I had to watch a crap Mano Mano ad to see this video but it was worth it!
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Sorry for that but because of you more videos will come and you will get new quality free content.. I think it's a fair deal :)
@domenicocucinotta2720
@domenicocucinotta2720 8 ай бұрын
Is it necessary to declare the observable in the constructor? I have always declared it in the ngOninit. What's the benefit ?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 8 ай бұрын
If you declare a property in the component you can't declare it in ngOnInit, only in constuctor or inline. If you set a value in ngOnInit the initial value is undefined.
@TemporaryTemp-u4e
@TemporaryTemp-u4e Жыл бұрын
Another amazing video!! 🔥🔥
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
Appreciate it!!
@laoreis
@laoreis 3 жыл бұрын
Awesome, thanks for sharing!
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Thanks for watching!
@mralextacy
@mralextacy 10 ай бұрын
isnt it better to initialize values in OnInit rather than the constructor?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 10 ай бұрын
No as they are undefined then. If it is what you want then you can do it.
@g-luu
@g-luu 3 жыл бұрын
Great content. Earned yourself a subscriber. Just a bit skeptical about the shared module cause even Angular recommends it.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
It's up to you. There is never a silver bullet. If you have 5-10 components in shared you won't have any problems and it's fine. It's not fine when you have there 100 components, services and modules.
@g-luu
@g-luu 3 жыл бұрын
@@MonsterlessonsAcademy true that is why services should not live in shared. Would love to see you cover ngrx component store. At a global and component level.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
@@g-luu Thanks for the idea!
@nChauhan91
@nChauhan91 2 жыл бұрын
The observable approach looks great but if we need to perform any action like run a function on new data before assigning data to users object should we use subscribe or is there anyway to do that with an observer
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
"Run a function on new data" is exactly a subscribe. Rerender data in template on observable change is {{someFoo$ | async}} So for everything except of "Run a function on new data" it should be async pipe and for that case subscribe.
@nChauhan91
@nChauhan91 2 жыл бұрын
@@MonsterlessonsAcademy Thanks 👍🏻
@nickparana
@nickparana 2 жыл бұрын
Regarding first example with async pipe, what if you want to display a loading spinner while data is being fetched? how you do that with no subscriptions in an easy way (without using interceptors)?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
I create several streams. isLoading$, data$. I would create behaivour subject or use ngrx for that.
@mikhailratner4649
@mikhailratner4649 Жыл бұрын
Nice, a newly found Angular content creator 🤩 (or at least partly). Will sub an see if you'll continue putting out advanced Angular tutorials. Looking forward!
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
Welcome aboard!
@EvertonCanez
@EvertonCanez 3 ай бұрын
Hi, thanks for your videos. They have been really useful. However I have some questions for you: Why not using promises in Angular? Could I use them on http services at least? How to decide between promises | observables? *By promises I mean firstValueFrom | lastValueFrom
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 ай бұрын
I covered all in this video kzbin.info/www/bejne/goWboayLrL-Enqssi=OeJJGmM_-aismN0W
@andromadusnaruto1544
@andromadusnaruto1544 3 жыл бұрын
Very good tips. I've learnt a lot. Thanks very much for this video.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Glad it was helpful!
@SamOween
@SamOween 2 жыл бұрын
Thank you so much.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
You're welcome!
@Z3rgatul
@Z3rgatul Жыл бұрын
In your first example code looks pretty simple which is fine. But how can I add some loading indicator on the page with this? For me it looks like it is much easier to implement loading indicators with promise
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
It's the same this.isLoading = true this.getUsers().subscribe(users => this.isLoading = false)
@Z3rgatul
@Z3rgatul Жыл бұрын
@@MonsterlessonsAcademy Thanks, I see this will work. I know rxjs is "angular way", but I still don't see any real advantages besides "do it in observables because this is angular way". Watched few angular courses, and a lot of tips and tricks angular videos. We started migrating some old pages to new angular, and I am doing everything in promises.
@DurgeshTirumala
@DurgeshTirumala Жыл бұрын
Salute bro
@hamza201183
@hamza201183 3 жыл бұрын
I'm happy, I discovered your channel today. Subscribed! Any chance you show us your vim setup? Many thanks!
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Here is the video about my Vim setup. configs are in the description. kzbin.info/www/bejne/j6Ovmqidec12q80
@hamza201183
@hamza201183 3 жыл бұрын
@@MonsterlessonsAcademy Sorry I didn't notice this video. Many thanks.
@davidamour4501
@davidamour4501 Жыл бұрын
What do you mean by scalable? Doesn't 1 app run on 1 device on the client?
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
By scalable I mean that you can add more complexity without your app to become unsupportable.
@DaneDuPlessis
@DaneDuPlessis 3 жыл бұрын
Very helpful, thanks
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Glad it was helpful!
@sivananthdiwakar8591
@sivananthdiwakar8591 2 жыл бұрын
Useful Thank you !
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Glad it was helpful!
@FunctionDev
@FunctionDev 2 жыл бұрын
what theme of your vscode?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
It's gruvbox theme and vim editor. Here is a video about it kzbin.info/www/bejne/j6Ovmqidec12q80
@frontend3409
@frontend3409 2 жыл бұрын
How to handle the situation when you have 1000 components in SharedModule? Mayb you can do a video about solution to question #4?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Just don't do it. Split it by logic to different modules and don't create sharedModule at all.
@tkemaladze
@tkemaladze 2 жыл бұрын
very good videos. you should make more.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Thank you, I will
@deepikavellaluru
@deepikavellaluru 3 жыл бұрын
As usual,very helpful
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Glad to hear that!
@rangel_
@rangel_ Жыл бұрын
which vscode theme is this?
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
It's gruvbox
@oksanaandvovaserpiente7890
@oksanaandvovaserpiente7890 10 ай бұрын
How to test it? I mean the first case
@MonsterlessonsAcademy
@MonsterlessonsAcademy 10 ай бұрын
I made a video about it with steps to reproduce kzbin.info/www/bejne/rXWknpmno66lmc0si=2D9Wh9JQJ-JTBKXo
@shubhamagrawal4610
@shubhamagrawal4610 Жыл бұрын
Your new follower 😊
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
Welcome on board!
@pasindulakmal2712
@pasindulakmal2712 Жыл бұрын
Super important
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
Thanks!
@rkjessop
@rkjessop Жыл бұрын
The accent makes understanding difficult. The topic is important. Plz consider keeping the video and re-recording the audio track. I tried the CC feature, and it confirms the problem: "rick cheers" within 30 secs of the start.
@gabriel_reguera
@gabriel_reguera Жыл бұрын
How make "subscribe instead of streams" if my service returns an Observable
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
It doesn't mean you must eliminate subscribe completely from API. Sure subscribe for API calls is fine but people are overusing it a lot.
@gerardlanphear9185
@gerardlanphear9185 2 жыл бұрын
Another common mistake is to put too much in the ngOnInit. You can not do things that subsequently modify the DOM until the DOM is fully initialized. These will be ignored.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Yeap!
@gerardlanphear9185
@gerardlanphear9185 2 жыл бұрын
@@MonsterlessonsAcademy I had to look that up. Yeap indeed!
@ghfhhable
@ghfhhable 2 жыл бұрын
your accent is cool , where are you from?
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Originally Ukraine but already long time Germany
@jannickbreunis
@jannickbreunis Ай бұрын
I read in multiple sources, unsubscribing from a HttpClient call isn't necessary. Is it?
@MonsterlessonsAcademy
@MonsterlessonsAcademy Ай бұрын
It is not as it happens only once but I just unsubscribe from everything because you don't always see/remember if it's an httpclient or not.
@raphapiki
@raphapiki 2 жыл бұрын
Devs have to be careful when use change detection
@tripnation9659
@tripnation9659 Жыл бұрын
Bro are you croatian or serbian?
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
Ukrainian
@raptorthefirst
@raptorthefirst 2 жыл бұрын
Нормальное видео)
@balaeinstein8710
@balaeinstein8710 3 жыл бұрын
hi sir . i took your ngrx course . we need angular course from you sir
@MonsterlessonsAcademy
@MonsterlessonsAcademy 3 жыл бұрын
Thanks for the idea, I will add it to the plans of future courses.
@balaeinstein8710
@balaeinstein8710 3 жыл бұрын
@@MonsterlessonsAcademy thank you sir. Expecting angular course in the future 😊
@petraveryanov2572
@petraveryanov2572 2 жыл бұрын
You are completely wrong about ngFor - of course it does NOT re-render all elements when one is changed. And that can be easily verified. Object equality is used as tracking function by default. Another thing related to that users$: If that observable is actually http call (which nearly always true) you should not bother unsubscribing at all in most cases. Also if its http call your component behavior starts to depend on template (http observables are lazy and request is not fired when no subscriptions - and you have none in component class...) which is never good. Also u have no direct access to users length or to any element in component class. Taking all that into accout, I am very unsure that what you showed is a strong MUST -- its just opportunity, no more.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Thanks for your comment. It looks like you have good experience and you can make good decisions on your own. A lot of Angular devs which I see every day don't have that so they need some strict rules to write better code.
@raulrojas6552
@raulrojas6552 2 жыл бұрын
hey that's my code
@dinysanchez
@dinysanchez 2 жыл бұрын
Wow, been coding Angular for 2 years and I’ve been doing it all wrong. 😅 thanks for making this video!
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Happy to help!
@ytuser993
@ytuser993 2 жыл бұрын
and 1 more: write logic inside OnInit not in constructor
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
That depends. If you won't get properties for example from route in constructor you will need to handle all undefinds in your component. I prefer to do such things in constructor as well as assigning streams.
@Philippe275
@Philippe275 9 ай бұрын
ROFL I had an interview and ... yeah I should have watched this video before... cause everything I didn't have an answer to is in there...
@MonsterlessonsAcademy
@MonsterlessonsAcademy 9 ай бұрын
But now you watched it so just wait for the next interview :) Or even prepared to it with my full course of Angular questions monsterlessons-academy.com/courses/angular-interview-questions-coding-interview-2023
@OLIV3R_YT
@OLIV3R_YT 2 жыл бұрын
But "Tour of heroes" looks exactly like the bad example.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
It is beginners level and not the patterns which are suitable for big apps.
@emmanuelU17
@emmanuelU17 Жыл бұрын
Subscribe? Wow that is very interesting
@MonsterlessonsAcademy
@MonsterlessonsAcademy Жыл бұрын
Glad to hear that!
@petrklika1092
@petrklika1092 2 жыл бұрын
If I am right, you could even remove the code from constructor (this.users$ = ...) and move it all to th class
@winfredj9820
@winfredj9820 2 жыл бұрын
choosing angular was my first mistake
@jeannuel
@jeannuel 2 жыл бұрын
I was very comfy with JavaScript but when I used Angular I learned more about TypeScript and I'm not looking back. Angular feels really robust but I totally get that you have to learn a lot of new things and thats time consuming when you're in a new project
@GammaWraith
@GammaWraith 2 жыл бұрын
Mistake 1: How do you do things after a value change if there is no subscribe? ``` filters$: Observable; constructor(private eventBus: EventBusService) { this.filters$ = this.eventBus.getChannel('filters') // do something when we have filters } ``` previously I'd do: ``` filters: string[] = []; this.subscription = this.eventBus .getChannel('filters') .subscribe((data) => { this.filters = data; // do stuff }); ``` Your approach is cleaner but I am not sure how it applies when you actually want to do stuff after the stream returns the values.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Do something is always subscribe. Update your values and rerender them in template not. In 90% cases you want rerender and not a function call.
@GammaWraith
@GammaWraith 2 жыл бұрын
@@MonsterlessonsAcademy Sweet thanks for sharing
@Ostap1974
@Ostap1974 2 жыл бұрын
Guess what is the Tour of Heroes way of introducing Angular? this.heroService.getHeroes().subscribe(heroes => this.heroes = heroes); To be fair, it becomes quite hard to use streams directly as soon as you need to do anything more complex with it, like combining different data sources etc.
@MonsterlessonsAcademy
@MonsterlessonsAcademy 2 жыл бұрын
Yes Angular and stream are not easy but this is what we have. This is why typically Angular is being paid better than React for example
Angular Interview Questions You Should Know
10:01
Monsterlessons Academy
Рет қаралды 61 М.
I was just passing by
00:10
Artem Ivashin
Рет қаралды 18 МЛН
From Small To Giant 0%🍫 VS 100%🍫 #katebrush #shorts #gummy
00:19
Change Detection in Angular - You Project Is 20x Slower!
15:16
Monsterlessons Academy
Рет қаралды 73 М.
Angular Unit Testing | TOP 5 Mistakes to Avoid
23:36
Decoded Frontend
Рет қаралды 7 М.
Angular Code Review Best Practices - Refactoring From Junior Level to Senior
27:10
5 Tips for Using Angular More Efficiently
20:04
NeverBenBetter
Рет қаралды 22 М.
Top 10 Tips For New Angular Developers
21:18
Program With Erik
Рет қаралды 50 М.
TOP 6 Mistakes in RxJS code
18:35
Decoded Frontend
Рет қаралды 23 М.
Angular Interview Questions and Answers - Dominate Your Next Interview
49:13
Monsterlessons Academy
Рет қаралды 28 М.
Angular Mistakes #6: 🛑 STOP Overusing Centralized Stores
20:20
Angular University
Рет қаралды 6 М.
I was just passing by
00:10
Artem Ivashin
Рет қаралды 18 МЛН