Skip to content
Diego Haz edited this page May 19, 2017 · 4 revisions

ARc uses a modular approach to better organize redux stuff. It was inspired by ducks-modular-redux. However, this handles not only actions and reducers, but also selectors, sagas, middlewares etc.

In short, a redux module is:

  • A feature with action creators, reducer, selectors, sagas, middlewares and any other thing from the redux ecosystem;
  • Complete, which means that one feature will not be separated into multiple modules;
  • Pluggable, which means that you can always add or remove it to have or not that feature without having to change other redux modules.

A redux module tree looks like this:

src/store
├── entities # handles normalizr
│   ├── middleware.js
│   ├── middleware.test.js
│   ├── reducer.js
│   ├── reducer.test.js
│   ├── schemas.js
│   ├── selectors.js
│   └── selectors.test.js
├── resource # handles some resource
│   ├── actions.js
│   ├── actions.test.js
│   ├── reducer.js
│   ├── reducer.test.js
│   ├── sagas.js
│   ├── sagas.test.js
│   ├── selectors.js
│   └── selectors.test.js
├── social # handles social login
│   ├── actions.js
│   ├── actions.test.js
│   ├── reducer.js
│   ├── reducer.test.js
│   ├── sagas.js
│   ├── sagas.test.js
│   ├── selectors.js
│   └── selectors.test.js
├── status # handles loading/error status
│   ├── reducer.js
│   ├── reducer.test.js
│   ├── selectors.js
│   └── selectors.test.js
├── actions.js # exports all actions from all modules
├── configure.js # configures the store
├── middlewares.js # exports all middlewares from all modules
├── reducer.js # exports the root reducer using all modules
├── sagas.js # exports the root saga using all modules
└── selectors.js # exports all selectors from all modules

Take a look at Example redux modules to learn more about it.

Clone this wiki locally