0.0.11 • Public • Published

React Remote Redux

Remote Redux bindings for React with reasonable defaults.

ReactRemoteRedux provides a redux store via react-redux. It uses remote redux behind the scenes to compute the next state.

Installation and Usage

npm install react-remote-redux
import ReactRemoteRedux from "react-remote-redux"
export default () => (
  // Works similarly to <Provider /> from react-redux
  <ReactRemoteRedux endpoint="/api/reduce">
    <App />

Your App can now access the redux store normally, e.g. with the react-redux connect method.

By default, the endpoint /api/reduce will be called with a POST request whenever an action matches the condition action.remote || action.type.startsWith('REMOTE_'). The POST request will contain two parameters state and action. The state is the complete redux store state on the client (see this note on efficiency). The POST request should return a JSON object with a key newState in it's body containing the next state of the application.


Prop Description Example
endpoint Server endpoint to send POST request to. "/api/reduce"
localReducer Optional A reducer reducer of the form (state, action) => state
initialState Optional The default redux store state null
initialAction Optional An initial action to be executed, e.g. to perform the initial page load { type: 'REMOTE_LOAD_PAGE', page: window.location.pathname }
detectRemoteAction Optional Method used to detect if the action should be sent to the server (remote reducer) action => action.remote || action.type.startsWith('REMOTE_')
makeRequest Optional Method to perform request to server of type (state,action,responseCallback) => any
applyResponse Optional Method to apply the response from the server to create the new state (response) => response.newState
middlewares Optional Redux middlewares []
useReduxDevTools Optional Integrate with redux dev tools extension false


If you're dealing with enough state (e.g. your state is hundreds of KB), you should intelligently encode it before sending it to the server. There are a lot of ways to do this, you can have the server remember the state of the client and have the client send up only mutations on the state, you can configure actions to only send necessary state, and/or you can have the server only return the mutations of the state rather than the entire state. To do these, look at overriding the applyResponse and makeRequest props.




npm i react-remote-redux

DownloadsWeekly Downloads






Unpacked Size

207 kB

Total Files


Last publish


  • seveibar