Decoded Frontend
Decoded Frontend
  • Видео 132
  • Просмотров 2 632 053
TOP 6 Mistakes in RxJS code
To try everything Brilliant has to offer-free-for a full 30 days, visit brilliant.org/DecodedFrontend.
You’ll also get 20% off an annual premium subscription.
From this video, you will learn the TOP 6 mistakes developers make when writing RxJS code. Watch this video until the end, and you will see how to make your RxJS code more reliable, clear, and performant. If you find this video useful, please share it with your colleagues and friends. Enjoy!
👉 See All Angular Courses - bit.ly/discounted-course-bundle
🕒 Time Codes:
00:00 - Intro
00:00:54 - Project Overview;
00:02:56 - Nested Subscriptions;
00:05:38 - Wrong usage of takeUntil for unsub;
00:07:20 - Manual Subscriptions;
00:09:34 - Observable r...
Просмотров: 13 910

Видео

Reactive Forms in Angular - Dynamic Validation
Просмотров 7 тыс.Месяц назад
Learn Everything About Angular Forms 🚀 bit.ly/advanced-angular-forms_yt In this video about Reactive Forms in Angular, I will show you how you can apply and remove validators to certain form controls dynamically, depending on the values from other form controls in your Angular Form. I will show you how to do that using ReactiveForms. You will see which pitfalls you might encounter while impleme...
Content Projection in Angular - Complete Guide (Beginners/Advanced)
Просмотров 13 тыс.Месяц назад
👉 To try everything Brilliant has to offer for free for a full 30 days, visit brilliant.org/DecodedFrontend You’ll also get 20% off an annual premium subscription. In this video, besides the basics of content projection in Angular, you will also learn more advanced scenarios like multi-slot content projection, Content Re-Projection, Projection aliasing, and ngProjectAs attribute, and last but n...
RxJS Scan Operator - How to Manage the State
Просмотров 9 тыс.2 месяца назад
Learn everything about Angular Forms 🚀 bit.ly/advanced-angular-forms-course-updated 👉 See All Angular Courses - bit.ly/discounted-course-bundle Have you ever had a use case when you had an RxJS data stream and wanted to shape some state from it? Watch this video until the end, and you will learn how you can create and manage the state right in the stream so that you can deliver data right to th...
Component Input Binding in Angular Router
Просмотров 8 тыс.3 месяца назад
Learn everything about Angular Forms 🚀 bit.ly/advanced-angular-forms-course-updated 👉 See All Angular Courses - bit.ly/discounted-course-bundle 🕒 Time Codes: 00:00:00 - Intro; 00:01:19 - Routes handling in Angular; 00:02:14 - Idea behind Component Input Binding; 00:04:39 - Naming conflict resolution 00:05:44 - Real-life use case; 00:09:35 - Outro; 🔗 Source code from the tutorial: github.com/DMe...
Angular Model - The New Signal-Based 2-way Data Binding
Просмотров 20 тыс.4 месяца назад
🔥 Conscious Angular Testing for Beginners with 10%-OFF (For the First 10 Students): bit.ly/conscious-angular-testing_U8YXaWwyd9k Recently, Angular 17.2 was introduced, which brings a new API that enables deeper integration of Signals into Angular components. One of these new functions is a function `model`, which enables the 2-way data binding and which one I am going to cover in this video. Yo...
Input Signals in Angular 17.1 - How To Use & Test
Просмотров 24 тыс.4 месяца назад
Learn more about RxDB - bit.ly/rxdb 🚀 The introduction of Input Signals is another step towards the integration of Signals into Angular Framework Core. From this video, you will learn how to migrate your angular components to input signals smoothly and how to adjust your unit tests. Besides that, you will know how to make your inputs reactive even before Angular 17.1. If you find this video use...
Deferrable Views - New Feature in Angular 17
Просмотров 19 тыс.5 месяцев назад
Level up your Angular skills with my Advanced Courses 🚀 bit.ly/discounted-course-bundle Discover the easy way to load parts of your website only when needed with Angular 17's new feature: Deferrable Views. This video shows you how this cool tool helps to load your website faster and smoother, making your coding life simpler. Great for both new and experienced Angular users. Watch, learn, and sh...
Angular Testing - New Course & Giveaway Teaser 🎉
Просмотров 8 тыс.7 месяцев назад
Angular Testing - New Course & Giveaway Teaser 🎉
Angular 17 - New Build-In Control Flow Overview 🚀
Просмотров 36 тыс.7 месяцев назад
Angular 17 - New Build-In Control Flow Overview 🚀
Scraping Data from Amazon using Scraping Browser API, ExpressJS & Angular
Просмотров 3,9 тыс.8 месяцев назад
Scraping Data from Amazon using Scraping Browser API, ExpressJS & Angular
The Role of "exportAs" Property in Angular [RE-UPLOADED]
Просмотров 13 тыс.8 месяцев назад
The Role of "exportAs" Property in Angular [RE-UPLOADED]
How to Make Forms in Angular REUSABLE (Advanced, 2023)
Просмотров 59 тыс.9 месяцев назад
How to Make Forms in Angular REUSABLE (Advanced, 2023)
Web Workers in Action - Performance Boost for Web Applications (2023)
Просмотров 23 тыс.10 месяцев назад
Web Workers in Action - Performance Boost for Web Applications (2023)
How To Make Angular Code More Reusable
Просмотров 27 тыс.11 месяцев назад
How To Make Angular Code More Reusable
Angular NgRx - How to use Feature Creator (API Overview, 2023)
Просмотров 17 тыс.11 месяцев назад
Angular NgRx - How to use Feature Creator (API Overview, 2023)
Reset Forms in Angular using Reactive Forms
Просмотров 11 тыс.Год назад
Reset Forms in Angular using Reactive Forms
Pitfalls Of Using takeUntil and takeUntilDestroyed RxJS Operators
Просмотров 20 тыс.Год назад
Pitfalls Of Using takeUntil and takeUntilDestroyed RxJS Operators
The new DestroyRef Provider in Angular 16 (2023)
Просмотров 12 тыс.Год назад
The new DestroyRef Provider in Angular 16 (2023)
Change Detection in Angular Pt.3 - OnPush Change Detection Strategy
Просмотров 25 тыс.Год назад
Change Detection in Angular Pt.3 - OnPush Change Detection Strategy
Change Detection in Angular Pt.2 - The Role of ZoneJS (2023)
Просмотров 20 тыс.Год назад
Change Detection in Angular Pt.2 - The Role of ZoneJS (2023)
Change Detection in Angular - Pt.1 View Checking
Просмотров 34 тыс.Год назад
Change Detection in Angular - Pt.1 View Checking
First look at Signals in Angular
Просмотров 44 тыс.Год назад
First look at Signals in Angular
Design Patterns in Angular Source Code - Strategy Design Pattern
Просмотров 17 тыс.Год назад
Design Patterns in Angular Source Code - Strategy Design Pattern
Design Patterns in Angular Source Code - Bridge Design Pattern
Просмотров 24 тыс.Год назад
Design Patterns in Angular Source Code - Bridge Design Pattern
Component-Less and Empty-Path Routes in Angular (2023)
Просмотров 13 тыс.Год назад
Component-Less and Empty-Path Routes in Angular (2023)
Demystifying Angular Two Way Binding (2023)
Просмотров 12 тыс.Год назад
Demystifying Angular Two Way Binding (2023)
NgTemplateOutlet in Angular - Everything You Have to Know (2022)
Просмотров 47 тыс.Год назад
NgTemplateOutlet in Angular - Everything You Have to Know (2022)
Angular Builders - Creating Custom Builder from Scratch (Advanced, 2022)
Просмотров 9 тыс.Год назад
Angular Builders - Creating Custom Builder from Scratch (Advanced, 2022)
Angular Builders - How Do They Work? (2022)
Просмотров 8 тыс.Год назад
Angular Builders - How Do They Work? (2022)

Комментарии

  • @bifty9
    @bifty9 День назад

    Thank you for this great idea! I use it for loose coupled components (with routing) that work together as a generic form. But i have a problem to make the injection / parentContainer optional. So if i want to use the same component as a single form component or with a parent form. Any Optional( ) or something like deps: [[Optional, NgForm]] is not working (still get an null injection error...). Any tips how to fix that?

    • @bifty9
      @bifty9 День назад

      Ah, i got it working. I used the Optional syntax wrong. First trys was with deps: [[Optional, NgForm]] Second Try was with an @Optional before the Token. But correct syntax is this: useFactory: () => inject(ControlContainer, {skipSelf: true, optional:true}) Now it works, you only have to adjust the getter for the "parent" Container to use the local formGroup instead of the one from the parent if it not exists. Also adjust the templat to provide a parentFormgroup then. Good Day folks and thx, fopr sharing tips 🙌

  • @ievgensvichkar2643
    @ievgensvichkar2643 2 дня назад

    Thank you for the detailed ng-content video. Always learn smth new from your videos. In current one it was - the re-projection tricks and using a directive for getting a reference to a template. Thanks.

  • @user-cx7wz9mm1q
    @user-cx7wz9mm1q 2 дня назад

    Watching all of your videos. You have improved my career so much bro, many thanks...🙏

  • @sergeymigel4680
    @sergeymigel4680 2 дня назад

    interesting.....

  • @ThoBui-qk4yq
    @ThoBui-qk4yq 2 дня назад

    please release a video on creating a best project structure in angular

  • @nelson3391
    @nelson3391 2 дня назад

    Great explanation. Thanks a lot

  • @vinaykadam3897
    @vinaykadam3897 4 дня назад

    Great video! It solved my split form issue. However, do you mind addressing the test case for this as well?

  • @gsgonzalez88
    @gsgonzalez88 4 дня назад

    Excelent explanation! thanks!

  • @weradsaoud2018
    @weradsaoud2018 5 дней назад

    Thank you.

  • @onetwothree123-
    @onetwothree123- 5 дней назад

    For such simple scenarios imo we don't need even to write custom builder, the code can be placed right in the project, however thanks for the video it allow to understand how things work under the hood

  • @robertaliaj4908
    @robertaliaj4908 5 дней назад

    Second video of you that I’m watching, you have a great talent making things easy to understand 👌🏼

  • @weradsaoud2018
    @weradsaoud2018 6 дней назад

    Thank you

  • @akashwasson4220
    @akashwasson4220 6 дней назад

    bro, you are pro! Thanks a lot!

  • @user-mk8eu1cs1g
    @user-mk8eu1cs1g 6 дней назад

    Angular signals resemble MobX 🤔

  • @rahultej8352
    @rahultej8352 6 дней назад

    Is this source code shared anywhere?

  • @enverusta7811
    @enverusta7811 6 дней назад

    I have a question. Let's say that I have 8 common inputs in 2 different components. I can't handle them with binding a class or something since they are all object types. How can i handle this case? Should i stick with directives or abstract component?

  • @weradsaoud2018
    @weradsaoud2018 8 дней назад

    thank you

  • @Kobe24Geo
    @Kobe24Geo 8 дней назад

    Can you make a video about good and bad practices generally in Angular? For templates as well as ts component logics

  • @samiralholo2788
    @samiralholo2788 8 дней назад

    You are the best, I'm top fan, Could you please make same tutorial but for material v18🙏🙏

  • @user-lc7qs7gy5d
    @user-lc7qs7gy5d 9 дней назад

    2:05 hey what about , unsubscribing !! here form.valuechanges.subs .......

  • @abdelhamidouanes9941
    @abdelhamidouanes9941 9 дней назад

    Bravo !! Big thanks <3 bien expliqué, j'apprécie beaucoup votre efforts <3

  • @JoeBoo532
    @JoeBoo532 9 дней назад

    Hi, could you please explain the benefits of assigning the response results to an observable instead of just using an array? Thank you! loving your vid by the way! :D

  • @oleksandr3863
    @oleksandr3863 10 дней назад

    Observables created using fromEvent are cold observables.

  • @anhtrantruong9872
    @anhtrantruong9872 10 дней назад

    Wonderful it's still run in my case but when i use chat-app with another root routing look like they conflicts with each other. IT'S STILL WORK FINE but when need 2 click to bootstrapModule app-chat in current app. First click return Cannot match any routes ( with current route url ) . Does anyone has any solution ? Thank you

  • @user-gz9ky5zg7k
    @user-gz9ky5zg7k 11 дней назад

    I have been working as Angular developer for more than three years and I didn't find anything new but distinctUntilKeyChanged) Anyway it is a really cool video as always and it gives good hints and advice)

  • @MythsoftheWorld-lm8oi
    @MythsoftheWorld-lm8oi 11 дней назад

    Hi, What extension do you use for generate a class?

  • @nelson3391
    @nelson3391 11 дней назад

    Thanks a lot!

  • @LuizFMPaiva
    @LuizFMPaiva 11 дней назад

    Amazing video. thanks Dmytro, u never disappoint ♥

  • @user-om4hp7me3d
    @user-om4hp7me3d 12 дней назад

    Damn, so cool !

  • @user-om4hp7me3d
    @user-om4hp7me3d 12 дней назад

    Great video, thank you

  • @enverusta7811
    @enverusta7811 12 дней назад

    Since we might need to use those handlers in other lists too, I implemented them in a more generic way like this: ```function removeHandlerFn<T>(indexToRemove: number) { return (state: T[]): T[] => state.filter((_element, index) => index !== indexToRemove); } function resetHandlerFn<T>(event: void) { return (state: T[]): T[] => []; } function accumulatorHandlerFn<T>(value: T) { return (state: T[]): T[] => [...state, value]; } function scanHandlerFn<T>(state: T[], stateHandlerFn: (state: T[]) => T[]) { return stateHandlerFn(state); }``` Also used them like this: ```ages$: Observable<number[]> = merge( this.reset$.pipe(map(resetHandlerFn<number>)), this.remove$.pipe(map(removeHandlerFn<number>)), this.debouncedAge$.pipe(map(accumulatorHandlerFn)) ).pipe(scan(scanHandlerFn, []));```

  • @enverusta7811
    @enverusta7811 12 дней назад

    It was really helpful!

  • @dev-gj3dh
    @dev-gj3dh 12 дней назад

    wow!!!

  • @weradsaoud2018
    @weradsaoud2018 13 дней назад

    Thank you, your videos on Angular are the best.

  • @user-pj5ve4jz1k
    @user-pj5ve4jz1k 13 дней назад

    На самом деле очень круто, мне кажется любой тут найдет что то полезное для себя, находясь на разных уровнях развития. В реальной жизни я придерживаюсь таких правил, но про shareReplay и distingUntilChanges я подчерпнул для себя что то новое

  • @bancamilleri1546
    @bancamilleri1546 13 дней назад

    Got to love some good old currying. I'd love to see more videos on more advanced usage of RxJS and how to tie together Signals nicely :)

  • @AshrafAli_SoftwareDev
    @AshrafAli_SoftwareDev 13 дней назад

    Thank you so much. It was really helpful for me. ❤

  • @IbrahimKwakuDuah
    @IbrahimKwakuDuah 14 дней назад

    I would have added all the code to the 'valueChange' in the example

  • @FlorianBinder
    @FlorianBinder 14 дней назад

    Thanks - I've learned a lot from this video!

  • @alexeyn2281
    @alexeyn2281 14 дней назад

    Great video! Could you give advice how to prorerly split vendor file to chunks?

  • @Edgars82
    @Edgars82 14 дней назад

    In mistake nr3 you did mistake. Should add sharereplay to observale if doing more than one async pipe to same observale. Edit. Ok in mistake nr4 you fixed mistake nr3 😅

  • @sergiim5601
    @sergiim5601 14 дней назад

    Great content, as always <3

  • @tz2014
    @tz2014 15 дней назад

    Who else liked it before even watching the video thinking it's always quality content

  • @tz2014
    @tz2014 15 дней назад

    Awesome, it's a always brilliant to learn from you

  • @doslass
    @doslass 15 дней назад

    Неймовiрна англiйська!

  • @anastasiia6513
    @anastasiia6513 15 дней назад

    🥸😎🤓🥸😎🤓🥸😎🤓