言語

ReactiveExtream

マーブル図を「読む」から「組み立てる」へ。

流れてくるイベントを、関数パイプラインで組み替えるパズルゲーム。
コードを書く代わりに、マーブル図の上で map / debounceTime / switchMap の効果を試そう。

1 2 3
→ map x × 2 →
2 4 6

1. 観察する

入力ストリームと正解ストリームをタイムライン（マーブル図）で見比べて、何が起きればよいか考える。

2. 組み立てる

map / filter / scan / debounceTime / switchMap など 39 種類のオペレータをつなぎ、パラメータを調整する。

3. 差分を見る

出力は即座に再計算され、正解との不足・余分・値違い・完了位置ずれが色で見える。一致すればクリア！

ゲームをはじめる ▶

94 ステージ / 12 サイクル / 39 オペレータ ・ インストール不要 ・ 依存ゼロ ・ クリア時に RxJS コードを自動生成