Action-reducers for Redux

Usage no npm install needed!

<script type="module">
  import drmznRedux from 'https://cdn.skypack.dev/drmzn-redux';



Actions, Reducers and action-reducers

Redux provides us with actions and reducers. Actions and reducers are meant to be separated, so reducers can be reused and be composable.

However, sometimes is more suitable to combine them at one place.

In order to use action-reducer, you create a namespace (shortcut for IIFE in typescript).

Every action-reducer function must have type, dispatch and reduce methods.

export namespace mySimpleAction {
    export const type = 'TEST_TYPE';
    export const dispatch(store, payload) {
    export const reduce(state, action) => immutable(state)
        .set('Some.section.subsection.test', action.payload)
        .set('Some.another.subsection.test', true)

Here we are using object-path-immutable to update the state.

How to dispatch an action
actions.mySimpleAction.dispatch(store, payload)

To dispatch and action, you need to pass the initialized store object as first variable and your data object as payload.

How to use with createStore?

Import your action-reducers and pass them to actionReducer.

import { createStore } from 'redux';
import { actionReducer } from 'drmzn-redux';
import * as actions from './src/actions';

createStore(actionReducer(actions), ...);

What else you can find in this package?


hydrate function that loads state from window.__PRELOADED_STATE__.


extension function that loads Redux extension.

How to use:

import { createStore } from 'redux';
import { actionReducer, hydrate, extension } from 'drmzn-redux';
import * as actions from './src/actions';

createStore(actionReducer(actions), hydrate, extension);