Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Reactive Programming in Javascript

Avatar for Andres Osorio Plata Andres Osorio Plata
October 28, 2015
Programming
0
120

Reactive Programming in Javascript

- What is RxJS
- Event Stream
- Why RxJS
- Rx Functions

Avatar for Andres Osorio Plata

Andres Osorio Plata

October 28, 2015
Tweet

More Decks by Andres Osorio Plata

See All by Andres Osorio Plata
Material Design Lite
Avatar for Andres Osorio Plata codeandrop
0
130
Todo App Angular 2
Avatar for Andres Osorio Plata codeandrop
1
170

Other Decks in Programming

See All in Programming
Navigating Dependency Injection with Metro
Avatar for Zac Sweers zacsweers
3
960
私の後悔をAWS DMSで解決した話
Avatar for 平目 hiramax
4
210
Updates on MLS on Ruby (and maybe more)
Avatar for sylph01 sylph01
1
180
Navigation 2 を 3 に移行する（予定）ためにやったこと
Avatar for yokomii yokomii
0
270
Rancher と Terraform
Avatar for Ryoma Fujiwara fufuhu
2
550
意外と簡単！？フロントエンドでパスキー認証を実現する WebAuthn
Avatar for teamLab teamlab
PRO
2
760
デザイナーが Androidエンジニアに 挑戦してみた
Avatar for Kanon Fujita 874wokiite
0
470
アセットのコンパイルについて
Avatar for ojun ojun9
0
130
ProxyによるWindow間RPC機構の構築
Avatar for syumai syumai
3
1.2k
旅行プランAIエージェント開発の裏側
Avatar for Ippo Matsui / 令和トラベル ippo012
2
910
概念モデル→論理モデルで気をつけていること
Avatar for sunnyone sunnyone
2
250
FindyにおけるTakumi活用と脆弱性管理のこれから
Avatar for adachi.ryo rvirus0817
0
520

Featured

See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
Avatar for Dan Newman danielanewman
229
22k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
33
2.4k
It's Worth the Effort
Avatar for 3n 3n
187
28k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
53
8.9k
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.4k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
90
590k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
525
40k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
368
19k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
16k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
23
3.7k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
Scaling GitHub
Avatar for Zach Holman holman
463
140k

Transcript

  1. Reactive Programming in Javascript Andres Osorio @codeandrop

  2. Agenda • What is RxJS • Event Stream • Why

    RxJS • Rx Functions • Demo time!

  3. RxJS - What • Asynchronous • Event-based • Observable sequences

    • Fluent query operators (filter, map, etc) • Extends the observer pattern • Data Streams

  4. Event Stream

  5. ASCII Diagram

  6. RxJS - Why • Avoid callback hell • Treat streams

    like collections (Array) • Promises on steroids • No flow control statements (if/for/etc)

  7. RxJS - Definition • Specify dynamic values behavior at time

    of declaration

  8. Double click event stream

  9. Example - "Who to follow" box

  10. Rx Functions - map

  11. Rx Functions - map

  12. Rx Functions - flatMap

  13. Rx Functions - flatMap

  14. Rx Functions - merge

  15. Rx Functions - merge

  16. Rx Functions - merge

  17. Rx Functions - combineLatest

  18. Rx Functions - combineLatest

  19. Demo Time!

  20. Links • http://jsfiddle.net/staltz/8jFJH/48/ • https://gist.github.com/staltz/868e7e9bc2a7b8c1f754 • https://egghead.io/series/introduction-to-reactive- programming

  21. Andres Osorio @codeandrop