@apparts/redux

#+TITLE: Redux-Boilerplate #+DATE: [2019-02-07 Thu] #+AUTHOR: Philipp Uhl

• Usage

Install =@apparts/redux=, create a file =store.js=:

#+BEGIN_SRC js import configureStore from "@apparts/redux";

import firststore from "./firststore"; import secondstore from "./secondstore"; // ...

const { store, persistor, types } = configureStore({ firststore, secondstore });

export { persistor }; export default store; #+END_SRC

** Stores

A store must export an object with:

• =reducer = :: A function that takes the action-types as an argument and returns the reducer.
• =actionNames = :: An array with all names of action-types of that store.
• =blacklisted <?boolean>= :: /Optionally/, you can specify a =blacklisted= value. If true, the store will be put in the blacklist for persisting. That means, the store will then not be persisted.

*** Filestructure

A store should be in a subdirectory of the =store.js= file. A sensible filestructure could be:

• src
  • redux
    • store.js
    • firststore
      • index.js
    • secondstore
      • index.js
      • actions.js
      • reducer.js
  • ...rest of your project

Small stores can be put in a single =index.js= file, larger stores should be split into separate files for actions and reducers.

*** Single file store Below is an example for the =index.js= of a store:

#+BEGIN_SRC js export const setOffline = () => ({ type: "SET_NETWORK", state: false, });

export const setOnline = () => ({ type: "SET_NETWORK", state: true, });

const actionNames = [setOffline().type];

const defaultState = true; const reducer = (types) => (state = defaultState, action = {}) => { switch (action.type) { case types.SET_NETWORK.name: return action.state; default: return state; } };

export default { reducer, actionNames, blacklisted: true, }; #+END_SRC

*** Multi file store

An example for the =index.js= of a store, that is split into multiple files: #+BEGIN_SRC js import reducer from "./reducer"; import actionNames from "./actions"; export * from "./actions"; export default { reducer, actionNames, }; #+END_SRC