Architecture Patterns around Angular2: Redux, Flux, React, Reactive, RxJS, Ngrx, MVI,

Question

All names of these libraries / frameworks begin with the letter R / N or the sound is very similar; irritation guaranteed:

reaction / reduction | flux | ngrx | @ ngrx / shop | RxJS / ReactiveX | MVI | ....

Can anyone see this madness? I am trying to clarify, please help me if I am wrong:

Redux is a “predictable state container” for JavaScript applications and an easy implementation of Flux . Can I say: standard thread implementation for Angular2? (But there is also a great freeze video about redux without Angular2.)

Flux is the application architecture used by Facebook to create web-based client applications. It complements the components. (ReactJS) using a unidirectional data stream. But the flow is just a model, not an implementation.

React (ReactJS) is the main competitor to Angular2 (angular.io) , although it is more of a library than a structure.

Reactive Extensions for JavaScript (RxJS) is a reactive stream library that allows you to work with asynchronous data streams. It has the goal of a reactive manifest.

Angular2 has its own Reactive Extensions, and they are called Ngrx - reactive extensions for Angular2.

Then there is something like @ ngrx / store , which is RxJS state management inspired by Redux for Angular 2 application. Nam-a-daisy!

Alternatively, Flux André Staltz introduced the unidirectional <strong architecture architecture Model-View-Intent (MVI) based on RxJS Observables, which he uses as the basis for Cycle.js . Although Angular 2 takes the form of two-way data binding, it does not prescribe a data flow architecture. One of its selling functions is the non-specificity of the model and it will work with MVC or Flux architecture. Therefore, developers need to choose the appropriate template. → Source

Answer 1

Reaction vs angular

React is just a library for visualizing a view — nothing more, and Angular is a whole platform. While it may seem like they are targeting a variety of issues, they can usually do both by working in webapps.

Why? Because more often you think of React as React + the whole ecosystem (routers, form libraries, state management, etc.).

Flux and Redux

You can see that Flux / Redux is often associated with React, but this is not entirely true. Flux and Redux are just an idea of ​​managing the state of an application. However, Redux (which is now the most popular) has its own implementation, which is now the official version of React. There are also other thread implementations .

Reactive programming

This is a paradigm. I highly recommend you go through. It's a long time, but it's worth it.

RxJS and @ngrx

Angular uses threads inside the kernel, for example. to manage change detection. Again, threads are just an idea, and RxJS is one of the implementations of this idea. @ngrx is a collection of helpers built on top of RxJS. One of them is a public administration implementation created by Redux called @ ngrx / store .

MVI

This is an architectural template (e.g. MVC) for structuring applications clicked by Cycle.js . Here's a great explanation of the Unipirectional UI Architectures we're talking about Andre Stalz, the creator of Cycle.js .