Learn about RxJS to write efficient asynchronous code. Explore subjects, operators, and observables. Gain insights into creating projects like a reactive local database and handling DOM events.

mocha.tar.gz

rxjsCodeWidget

rxjsSPA

mocha

RxJS (Reactive Extensions for JavaScript) is a very powerful library for web development which allows you to easily write asynchronous or call-back code.

In this course, you will explore the latest version of RxJS in detail, focusing on how to apply the reactive paradigm to solve your day-to-day tasks. You will learn all the major components of this library including: subjects, operators, and how to test observables.

In the last section of this course, you will get hands-on with this library to create your own project. Throughout this project, you’ll learn about building a centralized loading indicator, how to handle DOM events, how to build a reactive local database, and more.

By the end of this course, you will have a great new skill to add to your resume, and a cool new project for your portfolio.

Building Reactive Applications with RxJS

# Centralized loading indicator scenario

Suppose you are building an enterprise web application with a rich user interface (UI). The UI will consist of several components that consist of independent logic and make requests to the back end. Since each request may take some time, in many cases, it's best to notify the user that an action, that might take some time, is actually happening in the background. For our scenario, I have created a high-level architecture of a web application where the users can write code, save it, modify it, and export it as a project to be loaded locally. The UI can consist of several components that are each responsible for the given task. When an action is triggered on either component, some "loading" message, based on the type of action, will be shown to the user while the respective request is made to the browser.

Learn how to build a centralized service that can display a loading indicator in your application.

The Need for Reactive Programming

RxJS Subjects

RxJS Operators

Testing Observables

Real-World Projects in RxJS

Conclusion

Centralized Loading Indicator

Centralized loading indicator scenario