3 ms·

Redux always had to much boilerplate for me to prefer it. The last couple years I have been using the new Context API and spliting my app state out by creating

Redux always had to much boilerplate for me to prefer it. The last couple years I have been using the new Context API and spliting my app state out by creating a global context, and many domain specific contexts where the context contains both the data and functions used to work with that data. Typescript + state with data and functions created a great api per domain. I found this approach just as clean but with less boilerplate. Though redux does have some performance and tooling benefits.

tracker1 6y ago
I disagree... I use useSelector, and now all my actions.js files export a default useActions method with a wrapper I wrote... Yeah, the boilerplate setting up the middleware and initial reducer isn't fun... but it's been really rewarding and the react-redux hook has been a godsend. https://www.npmjs.com/package/react-redux-actions-hook https://www.npmjs.com/package/react-redux-actions-hook
- acemarke 6y ago
  Note that with Redux Toolkit, that store setup is now a single line: const store = configureStore({reducer: rootReducer}) https://redux-toolkit.js.org/usage/usage-guide#simplifying-store-setup-with-configurestore https://redux-toolkit.js.org/usage/usage-guide#simplifying-s...
  - tracker1 6y ago
    Cool, but I tend to use sessionStorage as a backup to the store to re-hydrate on reload... I also use the thunks plugin so that I can have actioncreators that do multiple dispatches.
    - acemarke 6y ago
      Right, and `configureStore` automatically adds the thunk middleware by default [0], as well as the Redux DevTools extension. You'd still have to pass in options for whatever persistence addon you want to use, but that would be something like: const store = configureStore({ reducer: rootReducer, middleware: [...getDefaultMiddleware(), myPersistenceMiddleware] }) Which is still shorter and easier to read than having to mess with `applyMiddleware` and `compose` yourself. [0] https://redux-toolkit.js.org/api/getDefaultMiddleware#included-default-middleware https://redux-toolkit.js.org/api/getDefaultMiddleware#includ...

tracker1 6y ago

I disagree... I use useSelector, and now all my actions.js files export a default useActions method with a wrapper I wrote... Yeah, the boilerplate setting up the middleware and initial reducer isn't fun... but it's been really rewarding and the react-redux hook has been a godsend. https://www.npmjs.com/package/react-redux-actions-hook https://www.npmjs.com/package/react-redux-actions-hook

acemarke 6y ago
Note that with Redux Toolkit, that store setup is now a single line: const store = configureStore({reducer: rootReducer}) https://redux-toolkit.js.org/usage/usage-guide#simplifying-store-setup-with-configurestore https://redux-toolkit.js.org/usage/usage-guide#simplifying-s...
- tracker1 6y ago
  Cool, but I tend to use sessionStorage as a backup to the store to re-hydrate on reload... I also use the thunks plugin so that I can have actioncreators that do multiple dispatches.
  - acemarke 6y ago
    Right, and `configureStore` automatically adds the thunk middleware by default [0], as well as the Redux DevTools extension. You'd still have to pass in options for whatever persistence addon you want to use, but that would be something like: const store = configureStore({ reducer: rootReducer, middleware: [...getDefaultMiddleware(), myPersistenceMiddleware] }) Which is still shorter and easier to read than having to mess with `applyMiddleware` and `compose` yourself. [0] https://redux-toolkit.js.org/api/getDefaultMiddleware#included-default-middleware https://redux-toolkit.js.org/api/getDefaultMiddleware#includ...