Reactivity

So far you learned 2 essential Reactive Programming principles: streams and immutability. Today we explore a third principle: reactivity. You’ll need:

  • a new ❚ subscribe card
  • a new ▬ setWifi listener piece

The ▬ setWifi listener piece. It turns the wifi on or off.

You also need all the cards and pieces you previously received. Let’s put them all together like this:

Chain

Yes! You can put cards one after another, in a chain. Each card in this chain operates on the stream generated by the previous card:

  • ❚ fromEvent reacts to the ▬ toggle. It creates a sequence of toggle events over time, in reaction to each toggle status change (read Episode 1).
  • ❚ map projects each toggle events to ✔ true or ✘ false (read Episode 2).
  • ❚ subscribe adds ▬ setWifi as a listener of the stream. This listener accepts boolean values (✔ true or ✘ false) and turns the wifi on or off accordingly.

Summary

In Reactive Programming we react to piece and stream updates. This is the reactivity principle. And today, by assembling several cards together, you built your first reactive machine!

  • you unlocked ❚ subscribe
  • you unlocked ▬ setWifi
  • you created a chain of cards
  • you subscribed to a stream, adding a listener
  • you learned the principle of reactivity

You now have the basic knowledge of Reactive Programming. Over the next lessons, you’ll receive new cards that transform streams.

Cédric Soulas Follow Hire me

Freelance Developer Advocate. Motion graphics with code. JavaScript and Elm. cedricsoulas.com

Subscribe to reactive.how newsletter

Join the Newsletter

Learn Reactive Programming and stay up-to-date:

Receive my latest news, product updates and programming visualizations. You can unsubscribe at any time.

Highlights

@CedricSoulas

Making an illustrated book!

The Illustrated Book of RxJS

Learn more →