redux-test-recorder - a redux middleware to automatically generate tests for reducers through ui interaction

•    Javascript

---

Redux test recorder is a redux middleware for automatically generating tests for your reducers based on the actions in your app. Currently I've written redux-test-recorder-react a component to provide a gui for recording tests in react but I'm hopeful recording components for other frameworks can be created in the future. Also take a look at our latest build which currently runs a test generated using this module by taking advantage of the eval command. For a better idea of what is going on, you can take a look at the test file here.

react redux tests tape reducer reactjs component react-component record react-redux

redux-webpack-es6-boilerplate - A starter project for modern React apps with Redux

•    Javascript

---

Note: If you still want to use a previous version, please checkout old-original-structure branch. A boilerplate using the power and simplicity of React, Redux, Webpack 2 + HMR, and ES6 + JSX via Babel. Includes Webpack's Tree Shaking configuration. It's suitable for scalable applications and organized using the custom variation of the Ducks pattern — approach when each module's entry file (feature-name.js) contains all of its related constants, actions/action creators, selectors and its reducer.

react boilerplate react-boilerplate redux redux-boilerplate webpack2 react-router flow tdd-workflow tdd sentry static-types css-modules sass redux-devtools starter-kit starter-template starter-react es6 hmr hot babel webpack architecture webpack-dev-middleware webpack-hot-middleware starter

universal-redux - An npm package that lets you jump right into coding React and Redux with universal (isomorphic) rendering

•    Javascript

---

Universal Redux is an npm package that when used as a dependency in your project provides a universal (isomorphic) rendering server. You can either use its defaults and begin coding your project, or configure it to your liking with custom Webpack options and Express or Redux middleware. It's intended as both an easy starting point for developers new to React and Redux, as well as an extensible base by which advanced developers can augment with their own middleware and keep up to date with the fast-moving React ecosystem. The quickest way to get started is to clone the starter project. This gives you a base project that is set up with default configurations of Webpack and Express.

react isomorphic universal webpack express hot-reloading react-hot-reloader redux renderer boilerplate babel npm

redux-cycles - Bring functional reactive programming to Redux using Cycle.js

•    Javascript

---

Handle redux async actions using Cycle.js. Then use createCycleMiddleware() which returns the redux middleware function with two driver factories attached: makeActionDriver() and makeStateDriver(). Use them when you call the Cycle run function (can be installed via npm install --save @cycle/run).

redux cycle-driver cyclejs cycle react side-effect reactive redux-cycle-middleware middleware functional-reactive-programming

redux-pack - Sensible promise handling and middleware for redux

•    Javascript

---

redux-pack is a library that introduces promise-based middleware that allows async actions based on the lifecycle of a promise to be declarative. Async actions in redux are often done using redux-thunk or other middlewares. The problem with this approach is that it makes it too easy to use dispatch sequentially, and dispatch multiple "actions" as the result of the same interaction/event, where they probably should have just been a single action dispatch.

redux middleware promise async normalize normalizr react

redux-firestore - Redux bindings for Firestore

•    Javascript

---

This assumes you are using npm as your package manager. It is common to make react components "functional" meaning that the component is just a function instead of being a class which extends React.Component. This can be useful, but can limit usage of lifecycle hooks and other features of Component Classes. recompose helps solve this by providing Higher Order Component functions such as withContext, lifecycle, and withHandlers.

firestore redux redux-middleware redux-enhancer firebase react react-redux react-redux-firebase redux-firebase react-firebase

redux-api-middleware - Redux middleware for calling an API.

•    Javascript

---

Redux middleware for calling an API. This middleware receives Redux Standard API-calling Actions (RSAAs) and dispatches Flux Standard Actions (FSAs) to the next middleware.

redux api middleware redux-middleware flux

redux-promise - FSA-compliant promise middleware for Redux.

•    Javascript

---

FSA-compliant promise middleware for Redux. The default export is a middleware function. If it receives a promise, it will dispatch the resolved value of the promise. It will not dispatch anything if the promise rejects.

redux promise middleware redux-middleware fsa flux

redux-promise-middleware - Enables simple, yet robust handling of async action creators in Redux

•    Javascript

---

Redux Promise Middleware enables simple, yet robust handling of async action creators in Redux. Given a single action with an async payload, the middleware transforms the action to a separate a pending action and a separate fulfilled/rejected action, representing the states of the async action.

redux async promises async-functions optimistic-updates middleware middlewares promise optimistic-update

redux-thunk - Thunk middleware for Redux

•    Javascript

---

Thunk middleware for Redux. As you can see, it also requires .default at the end.

redux thunk middleware redux-middleware flux

react-redux-loading-bar - Loading Bar (aka Progress Bar) for Redux and React

•    Javascript

---

A React component that provides Loading Bar (aka Progress Bar) for long running tasks. See Demo or its source code.

middleware redux react promise-middleware loading-bar progress-bar progress-simulation loading progress react-component

redux-storage - Persistence layer for redux with flexible backends

•    Javascript

---

Save and load the Redux state with ease. And you need to install at least one redux-storage-engine, as redux-storage is only the "management core".

react redux storage database storage-engine immutablejs redux-middleware fsa flux-standard-action flux immutable persistent data localstorage

redux-observable - RxJS middleware for action side effects in Redux using "Epics"

•    Javascript

---

RxJS 5-based middleware for Redux. Compose and cancel async actions to create side effects and more.This has peer dependencies of rxjs@5.x.x and redux, which will have to be installed as well.

rx ducks reducks redux middleware observable thunk async cancel action reactive rxjs

redux-logic - Redux middleware for organizing all your business logic

•    Javascript

---

Use the type of code you and your team are comfortable and experienced with. Testing your logic is straight forward and simple. redux-logic-test provides additional utilities to make testing a breeze.

redux middleware redux-middleware logic business-logic domain domain-logic epic saga observable side-effect promise async-await

redux-ecosystem-links - A categorized list of Redux-related addons, libraries, and utilities

•    

---

A categorized list of addon libraries for Redux, as well as other libraries that are closely related. This page overlaps with the Ecosystem page in the Redux documentation, and the Awesome-Redux list, but is much more comprehensive and includes more categories.

redux react middleware action reducer addons async store

redux-beacon - Analytics integration for Redux and ngrx/store

•    TypeScript

---

If you're using Redux or ngrx/store to manage your app's state, you can use Redux Beacon to tap into your dispatched actions and map them to events that are consumable by an analytics service (e.g. Google Analytics). With Redux Beacon your entire global state life-cycle becomes trackable. Redux Beacon is lightweight. The core Redux Beacon module is tiny (~ 1KB), and each target, extension, and util, is either around the same size or smaller.

redux ngrx react angular google-analytics redux-beacon analytics react-native

redux-little-router - A tiny router for Redux that lets the URL do the talking.

•    Javascript

---

redux-little-router is a tiny router for Redux applications that lets the URL do the talking.While the core router does not depend on any view library, it provides flexible React bindings and components.

redux router middleware

react-redux-firebase - Redux bindings for Firebase

•    Javascript

---

Redux bindings for Firebase. Includes Higher Order Component (HOC) for use with React. The Material Example is deployed to demo.react-redux-firebase.com.

redux firebase react redux-observable redux-thunk react-bindings redux-firebase redux-bindings react-redux babel hoc redux-react-firebase

redux-search - Redux bindings for client-side search

•    Javascript

---

Redux bindings for client-side search

redux search resources state middleware filter react

isomorphic-redux-app - Redux app demonstrating isomorphic rendering and routing (with redux-devtools)

•    Javascript

---

This project serves as a simple boilerplate to start building an isomorphic rendering application in React and Redux. Production has Devtools, logging and hot reloading middleware removed and the scripts/css compressed.