Here is a visual representation of Angular using NgRx

I think that its quite apt ....

I couldn't post the pic that i wanted to post because i'm sure that this site has some decency guidelines and i don't want to get kicked out

Redux and ngrx look like a good way to do what you already do in a more verbose way and with a lot of boilerplate.
I love the idea of keeping the state of the whole app and the single source of truth, but... why so verbose? It's almost more the time spent to write boilerplate code than the time spent writing "productive" code

I'd like to hear from developers which prefers Angular to React the reason of said preference.
I want to hear that becasue I like React way more than Angular since I find which is easier to learn (making a form with a React hook is easy while it takes days just to get a grip on Angular forms), it usually takes less code to do things, it doesn't force libraries which may not be necessary for your use case and just makes your bundle bigger (for example most things which are done in NgRx can be done just as easily with regular JS promises without the need of an external tool) and I generally prefer functional programming to OOP.
Said that I want to hear the other side, not to argue but because I want to know cases in which Angular may be a better choice than React to become a better rounded dev.

Is it just me or NgRx is overly complicated?

No mother fucker, I don't give a fuck about you wanting me to reinvent the fucking wheel to do state management. I'll just use NgRX like any sane guy and just handle it with stores.
I don't fucking care if you're my Angular teacher and never heard about NgRX stores.
I don't even fucking know why I'm still in this fucking course to begin with.

(I know this rant won't gather much attention, maybe there are just a bunch of people that know Redux and still less that used it in Angular).
I feel so bad, really, I just want to throw everything against the wall. I really hate ngrx, I hate redux and how it's de facto implemented in Angular. I talked with other developers and everyone around says that redux is hated only by people that don't understand it, and well, maybe it's stupid, but I hate it.

It's so different from Angular plain programming, why the hell I need to create a index.ts file? It looks so wrong.

Why the hell import * as reducer, why don't you just import the reducer?

Why do you need a switch statement? Really? We're in 2018, languages as python removed it, in the era of reactive programming why don't you just map a key to a function?

Why so many files? Why for a 20 rows module I've to write 5 files each of them twice longer?

Why so much boilerplate? The time spent at implementing everything will be ever gained back?

Why does everything looks so wrong?

Fuck Redux/ngrx. I'm done, I can't get my head around this ugly shit. All I wanted was to load/save api data in a clean way and display a loading indicator now and then. But definitely not multiplying my entire code base by 10. Actions, Reducers, Effects. What is this?! Fuck that rocket science.

Not a rant!

Anyone who worked with Angular 4 with ngRX 4 interested in lending a helping hand. I an stuck with some error from past 36hrs.
😥

Trying my hand on Angular with Ngrx. Wish me luck.

I'm having problems understanding ngrx (or simply rxjs...), once again.

I have a feature state called "World".
This state has three Actions: Init, InitSuccess and InitFailure.

Also I have other isolated feature states like "Mountains", "Streets", "Rivers".
They have actions like this and corresponding effects to fetch data: Load, LoadSuccess, LoadFailure.

Now I would like to add an effect to WorldActions.Init, which will dispatch Mountains.Load, Streets.Load, Rivers.Load one after another. So ideally an action log would look like this:

1. World.Init
2. Mountains.Load
3. Streets.Load
4. Rivers.Load
5. Mountains.LoadSuccess
6. Streets.LoadSuccess
7. Rivers.LoadSuccess
8. World.InitSuccess

Or when an error occurs:

1. World.Init
2. Mountains.Load
3. Mountains.LoadFailure
4. World.InitFailure

How could an effect pipeline for that look?
How can I dispatch World.InitSuccess only after all LoadSuccess-Actions have happened?
Or am I still trying to implement ngrx in a wrong/bad way?

PS: The reason I am putting everything into separate feature states is because "Mountains" etc. are standalone features on their own. Only in the context of a "World" they belong together. For this reason I can't create a monstrous effect "World.Load", without producing redundant code.

I hate react-redux boilerplate code and NgRx boilerplate codes too. How to avoid boilerplate code or minimize it?

I've heard about zustand but it is quite new. Legacy apps mostly use react-redux with lots of boilerplate codes.

To angular users: I still didn't try NgRx. Is it a better pattern than managing state with services, even for small apps?