What’s with Redux, ReduxSauce, Thunk, and Sagas?

What is Redux?

A library to create and manage data objects (aka state objects) based on the flux pattern.

Actions

Are requests to a store to take an action.

Example:
{ type: ADD_TODO, text: ‘Build my first Redux app’}

Action Types

An enum of allowable action types.

Reducers

Are handler functions for actions that apply the action payload.

myReducer = (state, action) => nextState

ReduxSauce

Is a library to make Redux more DRY. In doing so though, it makes the code less readable imo.

Thunk and Sagas

Calls to actions are synchronous. This means that action handlers cannot fetch data or have side effects. Thunk and Sagas solve this desire.

Reasons for: More powerful Redux can handle most of your biz logic
Reasons against: If not done carefully, you will end up with Redux spaghetti

Thunk

Thunk is an extended reducer which can (1) return a promise, and (2) actions are allowed to be called from within the promise (aka side-effects). For example, you can have an action which first sets a loading field = true in the store, fetches data, then updates the store when done.

Sagas

Sagas is like Thunk, but allows for action handling to be interrupted using generators

Further Reading

  • https://engineering.universe.com/what-is-redux-saga-c1252fc2f4d1

Leave a Reply

Your email address will not be published. Required fields are marked *