Practice Makes Perfect: RxJS

on YouTube ↗27m

" summary

Builds a working carousel with swipe keyboard and auto-timer using concrete RxJS code: merges touch and mouse events, computes deltas, emits only the final move with switchMap + takeUntil to capture final delta, uses fromEvent for keys, merges streams, and restarts an interval with repeatWhen to restart interval so user activity resets autoplay. Mentions RxJS v7 typing fixes and new APIs and demos an animationFrame observable for smooth tweens and live-debugged code that already runs in production.

AI-written summary · about

" chapters (9)

1. 0:00Start
2. 2:49Live Coding Time
3. 13:51The Swipe Feature
4. 16:01Add Keyboard Navigation for left arrow
5. 16:32Add Keyboard Navigation for right arrow
6. 20:09Proper Type Inference for generator functions
7. 21:14Property infer Type with Boolean constructor
8. 21:53AnimationFrame Observable
9. 23:36Changes for concat Operator

" related talks

• 19mPractice makes perfect - when it comes to RxJSJan Niklas Wortmann · NG Poland 2020
• 43mAdvanced patterns in RxJS - Operating heavily dynamic UI’s with RxJSMichael Hladky · NG-MY 2019
• 36mComplex Features Made Easy With RxJSBen Lesh · JSFoo 2018
• 36mIntroduction to RxJSKrzysztof Furmann · 4Developers 2017
• 25mRxJS all things!Simona Cotin · JSPoland Conf 2017
• 01h 10mRxJS Advanced Patterns – Operate Heavily Dynamic UIsMichael Hladky · ng-conf 2019
• 49mAdding Reactivity to your Web Apps using RxJSBen Lesh · QCon São Paulo 2018
• 01h 45mRxJs from ScratchAlain Chautard · ng-conf 2022