redux VS xstate

For the backend, we chose Python, Django Rest Framework. On the frontend, React, Redux, Saga, Sass. Let’s start with the backend, which was managed by Yegor. He writes about the server part of the project himself.

Use types for Redux state slices and action creators

If you are using Redux, then this is a lifesaver. We know Redux reducers can store a lot of data, and if you feed the complete store into any component, it will cause it to re-render anytime anything in that store updates.

State management is one of the useful aspects of most JavaScript frameworks, It is the management of input or data state across multiple data flows across an application. React does have in-built state management capabilities, but you’d rather use Redux or some other state management tool because it’s not the best to work with. Here is an example of state management in Redux:

Redux is a widely adopted library for managing global state in React applications. It follows a centralized store approach, where the entire application state is stored in a single JavaScript object.

redux

Alright, you knew Redux was coming.

Because the application is shared between server and browser, state is as well. If your app has a single source of state as is often the case with Redux, for example, sharing state between server and browser can be as simple as passing your state object through JSON.stringify() then adding it to a

Redux Documentation: The official Redux documentation covers everything you need to know about using Redux with React.

Next.js documentation on data fetching and state Next.js documentation on server components Redux documentation Next.js Redux Wrapper documentation

Lastly, I know that I've omitted many great tools like XState, React Query, and SWR. These tools are utilities that are very scalable in their own right, but aren't full replacements for a good state manager.

There's also a pared down, minimal version of xstate: https://github.com/statelyai/xstate/tree/main/packages/xstat...

XState is different, but very good when you need state machines

> But I rarely see mention of messier problems which consist of overlapping and perhaps hierarchical states.

That's what State Charts were designed for: https://www.inf.ed.ac.uk/teaching/courses/seoc/2005_2006/res...

It's used as the basis for a number of state machine / state chart libraries, for instance XState: https://xstate.js.org/docs/

XState (JavaScript/TypeScript) - A full featured library providing visualization, test helpers, and integrations for popular frameworks like React and Vue

But I want to impress upon you that this is just only one of many patterns you can use this hook for. While this is subjective, I am personally not a huge fan of Redux and this type of pattern. It has its merits, but I think once you want to start layering in new patterns for actions, Mobx, Zustand, or XState are preferable in my personal opinion.