typesafe-actions - Typesafe Action Creators for Redux / Flux Architectures (in TypeScript)

  •        53

Flexible functional API that's specifically designed to reduce types verbosity (especially maintainability concerns) and complexity (thanks to powerful helpers). When I was first starting with Redux and TypeScript I was trying to use redux-actions to simplify maintainability of action-creators. I was struggling and results were intimidating: incorrect type signatures and broken type-inference cascading throughout the entire code-base (read more detailed comparison).

https://github.com/piotrwitek/typesafe-actions

Tags
Implementation
License
Platform

   




Related Projects

redux-crud - A set of standard actions and reducers for Redux CRUD Applications

  •    TypeScript

Redux CRUD is a convention driven way of building CRUD applications using Redux. After building several Flux applications we found that we always end up creating the same action types, actions and reducers for all our resources. When building an app you might have resources like users, posts and comments.

flux-standard-action - A human-friendly standard for Flux action objects.

  •    Javascript

A human-friendly standard for Flux action objects. Feedback welcome. It's much easier to work with Flux actions if we can make certain assumptions about their shape. For example, essentially all Flux actions have an identifier field, such as type, actionType, or actionId. Many Flux implementations also include a way for actions to indicate success or failure, especially as the result of a data-fetching operation. Defining a minimal, common standard for these patterns enables the creation of useful tools and abstractions.

redux-actions - Flux Standard Action utilities for Redux.

  •    Javascript

The npm package provides a CommonJS build for use in Node.js, and with bundlers like Webpack and Browserify. It also includes an ES modules build that works well with Rollup and Webpack2's tree-shaking. The UMD build exports a global called window.ReduxActions if you add it to your page via a <script> tag. We don’t recommend UMD builds for any serious application, as most of the libraries complementary to Redux are only available on npm.

redux-act - An opinionated lib to create actions and reducers for Redux

  •    Javascript

An opinionated lib to create actions and reducers for Redux

ngrx-actions - ⚡️ Actions and Reducer Utilities for NGRX

  •    TypeScript

Actions/reducer utility for NGRX. It provides a handful of functions to make NGRX/Redux more Angular-tastic. Inspired by redux-act and redux-actions for Redux.


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-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.

ducks-modular-redux - A proposal for bundling reducers, action types and actions when using Redux

  •    Javascript

I find as I am building my redux app, one piece of functionality at a time, I keep needing to add {actionTypes, actions, reducer} tuples for each use case. I have been keeping these in separate files and even separate folders, however 95% of the time, it's only one reducer/actions pair that ever needs their associated actions. To me, it makes more sense for these pieces to be bundled together in an isolated module that is self contained, and can even be packaged easily into a library.

redux-actions - Flux Standard Action utilities for Redux.

  •    Javascript

Flux Standard Action utilities for Redux.

redux-bug-reporter - :bug: A bug reporter and bug playback tool for redux. :bug:

  •    Javascript

Redux Bug Reporter puts minimal overhead on redux actions. However, it does keep copies of initial state, final state on bug submission, and full copies of all actions dispatched. For an application with heavy actions (such as network requests with large payloads) or very frequent actions, Redux Bug Reporter will gradually take up more and more memory. As such, it's probably a good idea to disable in production by default. The examples below demonstrate the expected common behavior of only enabling Redux Bug Reporter in non-production environments. Redux Bug Reporter disables itself by default if window is undefined, so it will not negatively impact server side renders.

redux-socket.io - An opinionated connector between socket.io and redux

  •    Javascript

An opinionated connector between socket.io and redux. Socket.io client->server messages should should be sent by dispatching actions to redux's store, where the action is the payload. Socket.io server->client messages should be dispatched as actions when received.

react-native-redux-router - React Native Router using Redux architecture

  •    Javascript

I've decided to stop supporting this component in favor to new release react-native-router-flux (https://github.com/aksonov/react-native-router-flux). The new version doesn't depend from concrete Flux/Redux implementation and allow you to build nested navigators easily. Also it allows to intercept route 'actions' from your store(s).

redux-ignore - :recycle: higher-order reducer to ignore redux actions

  •    Javascript

Now you won't be able to increment the counter anymore, because the INCREMENT_COUNTER action is ignored. Have a read of the Implementing Undo History recipe in the Redux documents, which explains in detail how higher-order reducers work.

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.

redux-logger - Logger for Redux

  •    Javascript

LogRocket is a production Redux logging tool that lets you replay problems as if they happened in your own browser. Instead of guessing why errors happen, or asking users for screenshots and log dumps, LogRocket lets you replay Redux actions + state, network requests, console logs, and see a video of what the user saw. Note: logger must be the last middleware in chain, otherwise it will log thunk and promise, not actual actions (#20).

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-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.

react-redux-typescript-guide - The complete guide to static typing in "React & Redux" apps using TypeScript

  •    TypeScript

You should check out Playground Project located in the /playground folder. It is a source of all the code examples found in the guide. They are all tested with the most recent version of TypeScript and 3rd party type definitions (like @types/react or @types/react-redux) to ensure the examples are up-to-date and not broken with updated definitions. Playground was created in such a way that you can simply clone the repository locally and immediately play around on your own. It will help you to learn all the examples from this guide in a real project environment without the need to create some complicated environment setup by yourself.

redux-devtools-log-monitor - The default monitor for Redux DevTools with a tree view

  •    Javascript

The default monitor for Redux DevTools with a tree view. It shows a log of states and actions, and lets you change their history. Then you can render <DevTools> to any place inside app or even into a separate popup window.

crossbuilder - Building web, Electron, Cordova and Chrome apps, and cross-browser extensions with React, Redux and Webpack

  •    Javascript

Building web, Electron, Cordova and Chrome apps, and cross-browser extensions that use Redux actions for messaging. Redux states are synced between background, injected page, app window, extension popup and badge.