Introduction to Reactive Programming

50 minutes

"Reactive"

You've probably been hearing this word recently. Reactive Programming has you curious, and you want to dig in and start learning what it is all about.

What's the most difficult aspect of Reactive Programming? Thinking Reactive!

In this series, we will discover what it means to think Reactive through RxJS. We will exercise our minds, and let go of our old imperative and stateful habits of programing.

If you are brand new to reactive programming, watch this series first.

pro-course-rss-logo

PRO RSS Feed

Reactive Programming - What is RxJS?

Reactive Programming - Using an event stream of double clicks

P

Reactive Programming - Why choose RxJS?

P

Reactive Programming - Async requests and responses in RxJS

P

Reactive Programming - Rendering on the DOM with RxJS

P

Reactive Programming - New requests from refresh clicks

P

Reactive Programming - Clear data while loading with RxJS startWith

P

Reactive Programming - Sharing network requests with RxJS merge

P

Reactive Programming - Using cached network data with RxJS

P

Reactive Programming - An overview of reactive concepts

P
rx tutorial about Reactive Programming - What is RxJS?

Reactive Programming - What is RxJS?

4:31 rx

This lesson introduces Reactive Programming using RxJS in simple terms, with a concrete example and no scary terminology.

rx tutorial about Reactive Programming - Using an event stream of double clicks

Reactive Programming - Using an event stream of double clicks

4:36 rx PRO

See a practical example of reactive programming in JavaScript and the DOM. Learn how to detect double clicks with a few operators in RxJS.

rx tutorial about Reactive Programming - Why choose RxJS?

Reactive Programming - Why choose RxJS?

4:05 rx PRO

This lesson helps you think in Reactive programming by explaining why it is a beneficial paradigm for programming. See how reactive programming helps you understand the dynamic behavior of a value evolving over time.

rx tutorial about Reactive Programming - Async requests and responses in RxJS

Reactive Programming - Async requests and responses in RxJS

7:14 rx PRO

In this lesson we start building a small UI widget: suggestions box displaying users to follow in Github. We will learn how to perform network requests to a backend using RxJS Observables.

rx tutorial about Reactive Programming - Rendering on the DOM with RxJS

Reactive Programming - Rendering on the DOM with RxJS

5:22 rx PRO

Learn how to take data from a network response and display it on the DOM using RxJS reactive event streams.

rx tutorial about Reactive Programming - New requests from refresh clicks

Reactive Programming - New requests from refresh clicks

5:07 rx PRO

In this lesson we learn how to fetch new data whenever the refresh button is clicked. This lessons starts to give us a feeling of how is it to develop reactive applications in RxJS.

rx tutorial about Reactive Programming - Clear data while loading with RxJS startWith

Reactive Programming - Clear data while loading with RxJS startWith

6:28 rx PRO

Let's fix a small UI glitch that was occurring on startup and whenever the refresh button was clicked. In this lesson we will see how to avoid common bad habits of imperative programming, and how to use reactive programming to keep the complete dynamic behavior of a value specified in one convenient place.

rx tutorial about Reactive Programming - Sharing network requests with RxJS merge

Reactive Programming - Sharing network requests with RxJS merge

3:34 rx PRO

This lesson teaches how to control whether network requests are cached or are pessimistically re-executed, with the help of the RxJS merge operator.

rx tutorial about Reactive Programming - Using cached network data with RxJS

Reactive Programming - Using cached network data with RxJS

7:44 rx PRO

In this lesson, we learn how to build the final feature of our user interface: how to use the cached network response to replace a suggested user when the user clicks on the 'x' close button for that user.

rx tutorial about Reactive Programming - An overview of reactive concepts

Reactive Programming - An overview of reactive concepts

2:14 rx PRO

This video gives an overview of the concepts of reactive programming we saw during this series, and explains how reactive programming can provide true separation of concerns.

Presented by:

André Staltz

Andre is a user interface engineer at Futurice, with extensive knowledge
in reactive programming. He is a contributor to RxJS, has built
RxMarbles, written an introduction to reactive programming which went
viral, and collaborated to design ReactiveX.io. His current mission is
to redefine how we understand and structure user interfaces with the
reactive web framework Cycle.js.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?