RxJS Explorer 2.0 - Reactive

« Watch operators Newsletter

RxJS Explorer 2.0

Learn. Compare. Update.

This explorer is based on those three cards.

Learn how they work »

RxJS 5.0 RxJS 5.5 RxJS 5.6 RxJS 6.0 + rxjs-compat RxJS 6.0

Legacy dot-chaining operators 🗝️

In RxJS 5.0 and before, we only had dot-chaining operators. Already feeling nostalgic?

📦 package.json

"dependencies": { "rxjs": "^5.0.3", ... } dot-chaining Sources on Github This is the source code of the demo in Episode 27. Read the full tutorial: Episode 30 - Pipeable operators. Browse all episodes

Hello pipeable operators! 🎉

RxJS 5.5 introduced pipeable operators. In particular, you can easily build custom and reusable operators! Open the pipe method tab and look at the custom draw operator.

📦 package.json

"dependencies": { "rxjs": "^5.5.7", ... }

Pipeable operators

Use the pipe method built into Observable. Optionally, import the pipe function to build custom and reusable operators from other pipeable operators.

🌳 Imports, build and treeshaking

Pipeable operators can be imported from rxjs/operators. You should update your bundling tools and configuration to avoid larger application bundles.

⚗️ JavaScript pipeline operator

Try the experimental JavaScript pipeline operator with babel if you dare. This proposal is still at an early stage. pipe method dot-chaining pipeline Sources on Github Sources on Github Sources on Github This is the source code of the demo in Episode 27. Read the full tutorial: Episode 30 - Pipeable operators. Browse all episodes

Optional milestone ⛱️

RxJS 5.6 is meant to ease the upgrade to 6.0. This is a short-term option.

📦 package.json

"dependencies": { "rxjs": "^5.6.0-forward-compat.4", ... }

Pipeable operators

Use the pipe method built into Observable. Optionally, import the pipe function to build custom and reusable operators from other pipeable operators.

🌳 Imports, build and treeshaking

Pipeable operators can be imported from rxjs/operators. You should update your bundling tools and configuration to avoid larger application bundles.

⚗️ JavaScript pipeline operator

Try the experimental JavaScript pipeline operator with babel if you dare. This proposal is still at an early stage. pipe method dot-chaining pipeline Sources on Github Sources on Github Sources on Github This is the source code of the demo in Episode 27. Read the full tutorial: Episode 30 - Pipeable operators. Browse all episodes

Compatibility package 🎁

Install the rxjs-compat package to keep on using dot-chaining operators and deprecated APIs with v6.

📦 package.json

"dependencies": { "rxjs": "^6.0.0", "rxjs-compat": "^6.0.0", ... }

Pipeable operators

Use the pipe method built into Observable. Optionally, import the pipe function to build custom and reusable operators from other pipeable operators.

🌳 Imports, build and treeshaking

Pipeable operators can be imported from rxjs/operators. You should update your bundling tools and configuration to avoid larger application bundles.

⚗️ JavaScript pipeline operator

Try the experimental JavaScript pipeline operator with babel if you dare. This proposal is still at an early stage. pipe method dot-chaining pipeline Sources on Github Sources on Github Sources on Github This is the source code of the demo in Episode 27. Read the full tutorial: Episode 30 - Pipeable operators. Browse all episodes

Goodbye dot-chaining operators 👋

The legacy dot-chaining operators no longer exist in v6. And there are several API changes.

📦 package.json

"dependencies": { "rxjs": "^6.0.0", ... }

Pipeable operators

Use the pipe method built into Observable. Optionally, import the pipe function to build custom and reusable operators from other pipeable operators.

🌳 Imports, build and treeshaking

Pipeable operators can be imported from rxjs/operators. You should update your bundling tools and configuration to avoid larger application bundles.

⚗️ JavaScript pipeline operator

Try the experimental JavaScript pipeline operator with babel if you dare. This proposal is still at an early stage. pipe method pipeline Sources on Github Sources on Github This is the source code of the demo in Episode 27. Read the full tutorial: Episode 30 - Pipeable operators. Browse all episodes

Learn more about RxJS operators and deprecated operators:

Launchpad for RxJS

The Illustrated Book of RxJS

Cédric Soulas Follow Freelance Developer Advocate. Hire me Learn Reactive Programming

Receive my latest news aboutReactive Programming, free deck samples and RxJS tips:

Occasional updates, plus:

• A gif about reactive programming — every Monday

Subscribe