Skip to content

Use redux in the main and browser processes in electron

License

Notifications You must be signed in to change notification settings

tessro/electron-redux

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

electron-redux

package version code style: prettier

electron-redux data flow

Keeps your state in sync across all of your Electron processes by playing your actions in all of them.

// in the main process
import { syncMain } from '@paulrosania/electron-redux';
const store = createStore(reducer, applyMiddleware(syncMain));
// in the renderer processes
import { syncRenderer, wrapRendererReducer } from '@paulrosania/electron-redux';
const store = createStore(wrapRendererReducer(reducer), applyMiddleware(syncRenderer));

That's it! Just add each middleware to where you initialize your store, and wrap the renderer reducer so it can receive state from the main process. As long as your reducers are pure/deterministic (which they already should be) your state should be reproduced accurately across all of the processes.

Actions

Actions MUST be FSA-compliant, i.e. have a type and payload property. Any actions not passing this test will be ignored and simply passed through to the next middleware.

NB: redux-thunk is not FSA-compliant out of the box, but can still produce compatible actions once the async action fires.

Actions MUST be serializable

  • Objects with enumerable properties
  • Arrays
  • Numbers
  • Booleans
  • Strings

Local actions

By default, all actions are played in all processes. If an action should only be played in the current thread, then you can set the scope meta property to local.

const myLocalActionCreator = () => ({
  type: 'MY_ACTION',
  payload: 123,
  meta: {
    scope: 'local', // only play the action locally
  },
});

We also provide a utility function for this

import { stopForwarding } from "@paulrosania/electron-redux";
dispatch(stopForwarding(action));

Contributors

About

Use redux in the main and browser processes in electron

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 54.5%
  • JavaScript 42.8%
  • HTML 2.7%