Top 7 RxJS Concepts for Angular Developers

Поделиться
HTML-код
  • Опубликовано: 4 авг 2024
  • Learn 7 essential tips when using RxJS with Angular and Firebase, each with its own example. Full lesson: angularfirebase.com/lessons/t...
    JavaScript Evangelist BehaviorSubject: • Angular 2 RxJs Behavio...
    Learn about RxJS at learnrxjs.io
  • НаукаНаука

Комментарии • 75

  • @powderriverfarrier
    @powderriverfarrier 7 лет назад +120

    The concise to the point no bullshit approach is really helpful.

  • @pandarzzz
    @pandarzzz 4 года назад +20

    Timeline of Events🕗
    0:40 1. Important RxJS Methods - static vs. instance
    1:35 2. Subscriptions - extract data from observables
    2:42 3. Unsubscribe - prevent memory leaks
    3:05 4. Map Observables - transform data in the stream
    4:00 5. SwitchMap - handle data relationships
    4:45 6. Combine Observables - two observables -> one
    5:25 7. BehaviorSubject - share current data

  • @sechabamotaung8552
    @sechabamotaung8552 2 года назад

    Please keep making more videos like these. It's so straigt to the point, love it.

  • @RefactoringRyan
    @RefactoringRyan 3 года назад +2

    You have the most helpful angular content around.

  • @boathecat919
    @boathecat919 4 года назад

    thank you so much. I had to stop and take notes here and there but I fully understand all 7 Rxjs concepts now.

  • @christianwheeler8441
    @christianwheeler8441 6 лет назад +1

    Just found this channel. What a godsend!

  • @ajinkyax
    @ajinkyax 7 лет назад +15

    Thanks again for a neat video.
    I always struggle explaining CombineLatest and flatMap in my videos but you explained well in less time.
    I would love to see more RxJs video from you Jeff, since I really appreciate your deep thoughts and I'm fan of RxJs

    • @Fireship
      @Fireship  7 лет назад +2

      Glad you liked it! I definitely plan on doing more on RxJS, as this video is really just scratching the surface.

  • @vladimirsvicevic4506
    @vladimirsvicevic4506 5 лет назад

    Awesome explanation and real examples. Thank you for such a great video!

  • @polypus74
    @polypus74 5 лет назад

    Great presentation, great design, great audio, direct and to the point videos == subscribed!

  • @89srle
    @89srle 6 лет назад +2

    Great and concise explanation.

  • @otheraw5659
    @otheraw5659 6 лет назад

    Thanks a lot, This kind of video really hard to find in youtube. Please do more about pattern / technique like this

  • @ErayTonyali
    @ErayTonyali 6 лет назад

    Thank you for the great lessons!

  • @rajhawaldar
    @rajhawaldar 6 лет назад

    Thanks for the excellent Explanation. You explained these concepts in simplest way. Thanks once again..:)

  • @PrashantKumardaniel
    @PrashantKumardaniel 6 лет назад +1

    Okay, so the motive is modern world coding through basic common sense. Explained simply. thumbs up!

  • @beka123ful
    @beka123ful 7 лет назад +9

    Thank you for all your vids. They help me a lot while messing with angular and firebase :)

    • @Fireship
      @Fireship  7 лет назад

      Awesome, glad to hear that

  • @ClaudivanBarreto
    @ClaudivanBarreto 7 лет назад +1

    Great lesson!

  • @Zarevock666
    @Zarevock666 6 лет назад

    Thank you! Great video!

  • @zbesh
    @zbesh 5 лет назад

    Man, you are a sorcerer. thanks for an amazing video.

  • @billbortkevich2300
    @billbortkevich2300 4 года назад +1

    Great concept explanation. I had to listed some portions several times though, to comprehend,

  • @rishabhmalhotra1542
    @rishabhmalhotra1542 4 года назад

    You are the best channel and your website is helpful and helped me multiple times. Keep up good work

  • @iamshoaibkhalil
    @iamshoaibkhalil 2 года назад

    Congratulations for 1 million subscribers Jeff
    We love you

  • @antingchang3258
    @antingchang3258 3 года назад

    Oh i love the background music with that great content

  • @rahulkamboj4603
    @rahulkamboj4603 5 лет назад

    Really nicely explained

  • @andrewg2998
    @andrewg2998 3 года назад +1

    finally someone explained rxjs to me how I could understand it

  • @dimajoyti
    @dimajoyti 7 лет назад

    Hi, and thanks. You great man.

  • @carlosabud
    @carlosabud 3 года назад +1

    concept wise , this is still valid in 2021.

  • @Manuelarte
    @Manuelarte 5 лет назад

    Excellent video

  • @clutchshots6480
    @clutchshots6480 3 года назад

    Life changer...🔥🔥🔥

  • @greatmouhcine
    @greatmouhcine 3 года назад

    Thanks to you, I don't fear RxJs anymore

  • @swaminathbera6407
    @swaminathbera6407 3 года назад

    Thanks Fireship ❤️

  • @sorinvestemean9686
    @sorinvestemean9686 3 года назад

    thank you

  • @el3atmoney
    @el3atmoney 5 лет назад

    Awesome..

  • @Justaszz
    @Justaszz 3 года назад

    What plugin do you use to paste code from the clipboard?

  • @incredibleliu
    @incredibleliu Год назад

    Nice stuff

  • @valentinopereira58
    @valentinopereira58 6 лет назад

    Thanks dude

  • @LiranPeleg
    @LiranPeleg 7 лет назад +1

    Good video

  • @harrisonmayotte7226
    @harrisonmayotte7226 4 года назад +1

    Can we get a revamp for new versions & cloud firestore?

  • @d4lep0ro
    @d4lep0ro 6 лет назад

    can you provide an example of using Observable groupBy on a Firebase collection?

  • @stefanoslalic2199
    @stefanoslalic2199 5 лет назад

    What OS do you use? Linux Arch?

  • @amirsohel9260
    @amirsohel9260 4 года назад

    which theme you are using in your Visual code

  • @005yass
    @005yass 7 лет назад

    I'm realy very interested about the usine of rxjs and firebase in my app i'm waiting for a complet course do u geve coaching ?

  • @ttma1046
    @ttma1046 7 лет назад +2

    Thanks for the video!
    A quick question how can you paste the code ? do you use some quick paste tool?

    • @Fireship
      @Fireship  7 лет назад +8

      No plugins required. Just delete then ctrl-z.

    • @RafiAliKhan
      @RafiAliKhan 7 лет назад

      I was thinking about the paste tool too. Maybe there should be one. (But delete + CntlZ is a great way to do tutorials so its concise and quick)
      And your explanations are great, more videos, please.

  • @KyleHarrisonRedacted
    @KyleHarrisonRedacted 4 года назад +5

    My biggest takeaway from this: "....... THERE'S AN ASYNC PIPE??........ THERE'S AN ASYNC PIPE!! GRAAAAAAAAHHHHH!!!"

    • @nishikantbawache3390
      @nishikantbawache3390 3 года назад

      I'm as surprised as you are, async pipe. Was I living under a rock?

  • @xman6267
    @xman6267 5 лет назад

    I have no technical background just trying to understand how we would have handle data from API if we were not using this RXJS. angular is client side as far as i know and its not right to mix it with server side functionality might be violating Model View Controller architectural pattern.

  • @dfenstermaker
    @dfenstermaker 7 лет назад +2

    I believe you skipped mentioning the major benefits of switchMap. It's counterpart mergeMap does as you explained. switchMap on the other hand cancels the previous request.

    • @Fireship
      @Fireship  7 лет назад

      Thanks for pointing that out. I wanted to include both mergeMap and switchMap in this video, but find the latter is more common, especially when dealing with firebase auth.

  • @tomaskosik5783
    @tomaskosik5783 5 лет назад

    Hi Fireship, maybe it's a dummy question but what does the {{ (someObject | async)? .somePropertyOfObject }} mean? Is it some shorthand ternary operator or what? I've never seet it before. Many thanks.

    • @Pungiish
      @Pungiish 5 лет назад

      The question mark is for rendering the object, if it exists, which it doesn't at first, because it's set to null. But when he selects an animal, the method is fired, assigning currAnimal to the selected animal, thus someObject (currAnimal) is not null, and the html is rendered. Just like if( true ? "true" : "false" ) returns true and if ( false ? "true" : "false" ) returns false.

  • @masterxilo
    @masterxilo 4 года назад +1

    Why did it take the community of us programmers so long to use observables/streams/realtime dataflow pervasively? Excel demonstrated that it is a good idea years ago...

  • @anilgr1111
    @anilgr1111 4 года назад

    Why not use just a variable instead of behaviour subject. We get current value in case of variables too right ?

    • @genyklemberg
      @genyklemberg 3 года назад

      We can use Behavior Subject throughout the project, from component to component

  • @wytzevanderploeg1923
    @wytzevanderploeg1923 6 лет назад

    @2:44 I thought that unsubscribing was unnecessary for Observables that are finite/resolve. Like http requests for instance.
    stackoverflow.com/questions/38008334/angular-rxjs-when-should-i-unsubscribe-from-subscription

    • @Fireship
      @Fireship  6 лет назад

      Correct, if the Observable completes on it's own then unsubscribing is not necessary. Firebase observables continue to emit values, so it's necessary to unsub manually.

  • @stefantrninic3994
    @stefantrninic3994 6 лет назад

    Niceone

  • @lexiaontube
    @lexiaontube 6 лет назад

    great and neat but way too fast for me lol

  • @eternalwanderer3785
    @eternalwanderer3785 4 года назад

    This is great stuff, but your audio is way ahead of your video... the description of the attributes are done before the code is even displayed, and when it is displayed it disappears in a flash (6:40). Would be nice to slow it down a bit and not seem like you're rushing out the door.. even your exit music is playing before you're even done with explaining everything. I just feel like you want to wrap this up before it's even started.

  • @bravefastrabbit770
    @bravefastrabbit770 Год назад

    I'm probably one amongst few. But I actually prefer you talking slower and in a monotone voice, it's easier to follow

  • @datguy4104
    @datguy4104 Год назад

    This looks so easy... firebase 9 feels awful, or the docs are awefull... I can't tell.

  • @magictom8
    @magictom8 3 года назад

    Like and subscribe... but don't forget to unsubscribe().

  • @sober69
    @sober69 6 лет назад

    5:14 you have mistake. CombineLatest on two streams is gonna return pairs of [[cat, dog] , [cat, dog]....] instead of plain array. so your ngFor is not gonna work as you have shown

    • @genyklemberg
      @genyklemberg 3 года назад

      he is querying separate objects, not arrays of cats and dogs

  • @sathishshaj7815
    @sathishshaj7815 5 лет назад

    I can't understand anything, may be this video is not tend for beginners!

    • @genyklemberg
      @genyklemberg 3 года назад

      angular and rxjs is not for beginners, you need to master that:)

  • @uaplatformacomua
    @uaplatformacomua 3 года назад

    very unclear

  • @debayansaha820
    @debayansaha820 3 года назад

    U didn't use the map operator from RxJS. I think u used the map operator from vanilla JS and not RxJs.

  • @ThePatriotPirate
    @ThePatriotPirate 4 месяца назад

    Never ever subscribe in the component and assign dogs to this.dogs. 99.999% of the time it should be handled with async as cats was

  • @FidelGuajardo
    @FidelGuajardo 4 года назад

    thank you