[dceddia]

This paradox I think is what turns people off Redux when they first learn it. "All this code... for what benefit?" Of course it's total overkill for something like a counter, or a todo list, but it's tough to teach an introduction to something by starting with "here's a huge enterprise app, let's dive in" :)

I tried to call this out in the article to make sure people are aware that improving simple Counter examples is not what Redux is really meant for.

I'm considering putting together a larger course/book that does just what you say - build up a React app using plain state until it becomes painful, and then refactor it to add Redux. My question right now is, how far should I go? Do I walk through building the entire app with state (and push through the complexity), or do I give up at the first indication that Redux would make things easier?

[tootie]

I understand the value of redux but I'd lump it in with git as an invaluable and elegant solution with a terrible interface. The structure is very confusing up front and makes no sense to an outsider. I learned react in about 15 minutes because it's so intuitive, but redux keeps making me scratch my head.

IMO, It's a fundamental flaw with JavaScript that interfaces aren't rigorous or discoverable and redux is a willing victim.

[acemarke]

Can you clarify what you mean by "terrible interface" for Redux? What structure is "confusing"?

Is this a concern with docs, the core Redux store API, the React-Redux API, or something else? Any suggestions for how we can improve things?

[tootie]

I think it's mostly react-redux. There's arcane boilerplate in the connect function, mapDispatchToProps looks like a leaky abstraction, actions being passed as objects with a string in them is super brittle.

I don't have a fix, but I think just being able to inject a link to the store and then having an API that can be manipulated directly from the component would more comprehensible and cut down on the layers of indirection. I typically see corresponding action, reducer js file for a component when 95% of the logic is already in the component. Just merge them.

[acemarke]

Appreciate the feedback. Could you give specific examples of what you mean by "arcane boilerplate" and "leaky abstractions"? We don't have any plans to change the actual API, but I would genuinely be interested in any suggestions or concerns you have with it.

It's also worth noting that I personally highly recommend consistently writing separate action creator functions [0], and using the "object shorthand" argument to `connect` instead of writing a separate `mapDispatch` function.

That said, it also seems like part of what you're concerned with is the fundamental design of Redux. The use of plain object actions as a layer of indirection is deliberate [1], and it's what enables capabilities like time-travel debugging. Actions need to be serializable for that to work, and therefore strings are the best solution for the action's `type` field [2].

You certainly don't have to keep _everything_ in Redux. You should consider whether a given bit of state should live in Redux, or in a component's state [3]. But, if you _are_ going to keep data in Redux, then actions and reducers are necessary for the Redux data flow. They don't have to be in separate files [4], but they need to exist to update the store.

[0] http://blog.isquaredsoftware.com/2016/10/idiomatic-redux-why...

[1] http://blog.isquaredsoftware.com/2017/05/idiomatic-redux-tao...

[2] https://redux.js.org/docs/faq/Actions.html#actions-string-co...

[3] https://redux.js.org/docs/faq/OrganizingState.html#organizin...

[4] http://blog.isquaredsoftware.com/2017/05/idiomatic-redux-tao...

[tootie]

I guess it's a matter of taste, but using object shorthand for an API seems like and anti-pattern. APIs are where a rigorous definition is most valuable. Like I said, it works fantastically well once you get the hang of it, but try showing this to a newb and ask them to trace it. Nightmare.

I'm not being a grump either. I coded Perl professionally for over 5 years and am well-versed in terse, functional idioms, but the community rightfully decided that strings of punctuation were too obtuse for practical use.

[rahimnathwani]

> "here's a huge enterprise app, let's dive in"

I'd love to see a complete project that uses redux, and would be horrible without it. Any pointers?? :)

[acemarke]

I'm a Redux maintainer. Here's my two standard suggestions for more realistic sample apps:

- An 8-part "Build a Simple CRUD App with React and Redux" tutorial: http://www.thegreatcodeadventure.com/building-a-simple-crud-...

- My own "Practical Redux" tutorial series, which shows off specific useful React and Redux techniques within a sample app: http://blog.isquaredsoftware.com/series/practical-redux/

Also, my Redux addons catalog has a page listing many other interesting Redux-based apps, including purpose-built samples and real-world apps: https://github.com/markerikson/redux-ecosystem-links/blob/ma...

[kolme]

Here's a tool you most likely used at some point :)

https://github.com/devtools-html/debugger.html