DEV Community

Tomasz Kudlinski
Tomasz Kudlinski

Posted on

1 1

React-Redux - add second store to your app

You may encounter situation when you need second Redux Store in your app. Wait what? Isn't Redux a single store architecture...?

Yes it is, but maybe you have to extend existing application and you would rather not to interact with existing Redux Store.

Wit react-redux you can create new Store, which will be using separate context:

import React from 'react'
import {
  Provider,
  createStoreHook,
  createDispatchHook,
  createSelectorHook
} from 'react-redux'

const customContext = React.createContext(null)

export const useCustomStore = createStoreHook(MyContext)
export const useCustomDispatch = createDispatchHook(MyContext)
export const useCustomSelector = createSelectorHook(MyContext)

const customStore = createStore(rootReducer)

export function MyProvider({ children }) {
  return (
    <Provider context={customContext} store={customStore}>
      {children}
    </Provider>
  )
}

You can find docs about this solution here

Top comments (0)

SurveyJS custom survey software

JavaScript Form Builder UI Component

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

Learn more

đź‘‹ Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay