Introduction to basic concepts of reactive programming with RxJS such as observables, observers and subscriptions

Introduction

I’m working with “Angular” since the version 1.4 and I really enjoy it. It’s when I had switch to Angular 2 that I first heard about “RxJS” and reactive programming. I’m a bit ashamed to admit that my first reaction was to tell myself “who cares? I can build nice applications without it”… And I was not wrong… Indeed, it’s possible to create nice applications without “RxJS”, the same way it’s possible to be a very good golf player using a broom stick. At the end of the day, even though you learnt to play very well with the stick, making the effort to learn to play with a regular golf club will help you getting even better.

That’s the same with “RxJS” in “Angular”. Even though nothing forces you to use it (well… To be totally honest, the “HttpClient” implementation kind of forces you to), you’ll be way more effective and your application will be way more reactive if you master it.

My reluctance to learn how to use this awesome library was a lot correlated to the fact that, let’s admit it, it’s not the easiest library to master (even now I wouldn’t say that I master it). However, this also comes from the fact that the reactive programming approach is very different of every programming style I used to use.

This is why I decided to write a series of article guiding you through the journey of learning how to use “RxJS” in an efficient way in an “Angular” application. I don’t say that what you’re going to learn is the only way of using “RxJS” but it’s how I do it and so far, it seems pretty reliable.

In this article…

All right, here we go… The topic of this article is not the funniest thing ever. Indeed, before being able to start using “RxJS”, it’s better to understand the theory behind it. I’ll try not to overwhelm you with a ton of information, instead, I’ll give you the bare minimum theory you’ll need in the current article, then I’ll spread the bits that I left off in the next articles. So straighten up little solider and be brave, once you got through this article, you’ll be ready to have some fun with a lot of programming :-)

Reactive programming

The “Rx” in “RxJS” actually stands for “ReactiveX” which is a set of tools that you can use to do reactive programming. Indeed, you have to know that reactive programming is not specific to “JavaScript”. You can do reactive programming with “Java” using the “RxJava” library or in C## using the “System.Reactive” package. This means that “RxJS” is “just” the library to use in “JavaScript” to do reactive programming.

#angular #rxjs #javascript #web-development #programming