ThinkRx — Instant marble diagrams for RxJS, Bacon.js, Kefir.js reactive programming libraries with a bunch of examples
Know your Observables before deploying them to production!
1
2
3
4
5
6
7
8
9
10
11
12
const { rxObserver } = require('api/v0.3');
const { timer } = require('rxjs');
const { take, map } = require('rxjs/operators');
const msg = 'awesome';
timer(0, 5)
.pipe(
take(msg.length),
map(index=>msg[index])
)
.subscribe(rxObserver());
🔍 Start exploring with these examples
- RxJS
- creating Observable from Promise
- filter-ing emissions
- handling errors with catch
- switching to other Observable using switchMap operator
- Bacon
- interval operator
- Kefir
- sequentially operator
Try comparing RxJS interval, Kefir.js interval, and Bacon.js interval!
⚙️ Playground
This tool is aimed at assisting you in understanding observables by playing with them. There are some code examples prebuilt for you in the left menu. Further, you can modify any of them to see how it changes output. Once a snippet has changed — resulting output would be recalculated instantly.
NOTE:
Across all examples execution time is limited to maximum 1000ms and 1024 operations per tick.
Async browser APIs, like fetching, are not supported.
🛸 My other projects
- RecksJS — cute RxJS + JSX framework ❤️
- text-to-speech 🗣 and speech-to-text 👂 with RxJS
- <$> — React Observable Fragment:
<$>{ timer(0, 1000) }</$>
💬 Feedback
Your feedback and help are very welcomed at github issues!
🙏 Inspired by
http://rxmarbles.com/, https://www.learnrxjs.io and great talks by http://worrydream.com/