Book Image

Mastering Reactive JavaScript

By : Erich de Souza Oliveira
Book Image

Mastering Reactive JavaScript

By: Erich de Souza Oliveira

Overview of this book

If you’re struggling to handle a large amount of data and don’t know how to improve your code readability, then reactive programming is the right solution for you. It lets you describe how your code behaves when changes happen and makes it easier to deal with real-time data. This book will teach you what reactive programming is, and how you can use it to write better applications. The book starts with the basics of reactive programming, what Reactive Extensions is, and how can you use it in JavaScript along with some reactive code using Bacon. Next, you’ll discover what an Observable and an Observer are and when to use them.You'll also find out how you can query data through operators, and how to use schedulers to react to changes. Moving on, you’ll explore the RxJs API, be introduced to the problem of data traffic (backpressure), and see how you can mitigate it. You’ll also learn about other important operators that can help improve your code readability, and you’ll see how to use transducers to compose operators. At the end of the book, you’ll get hands-on experience of using RxJs, and will create a real-time web chat using RxJs on the client and server, providing you with the complete package to master RxJs.
Table of Contents (11 chapters)

Improving interaction with RxJS

One of the advantages of using functional reactive programming, is that it makes it easier to create rich user interfaces, creating new ways for the users to interact with your website. There are several ways to do this.

In this section, we are going to create an Easter egg for our web chat application. Easter eggs are hidden functionalities that can be accessed following one or more steps.

Our Easter egg will be accessed using a triple click in the message box. Every time a given user does a triple click in the message box we are going to fill the message box with the /roll_a_dice command.


In this section, I want to show you how you can easily create new ways for your user to interact with your application using functional reactive programming. I've chosen to use a triple click, because it is not a standard interaction, and I will compare the code needed to implement it, with and without functional reactive programming.

First let's see how we can implement...