Giter VIP home page Giter VIP logo

react-redux-cheatsheet's Introduction

react-redux-cheatsheet

Version Cheatsheet: 1.1.0
Version Article: 1.2.0

Overview

This repository contains a graphical cheat sheet for the workflow and concept of Redux in two resolutions: 1440px and 3840px.

The idea is to help new and existing Redux users to understand how the general mechanism of Redux works in some more detail and where to hook into this process.

Article

This repo furthermore holds an article that walks you through an extended version of this cheat sheet. Two very common libraries have been added to the extended version: 'react-router' and 'immutable'.

So, in order to supplement existing tutorials, this article describes the Redux conceptual overview and its workflow in a React Redux app. The description is starting with the dominant player in Redux Applications which is the store. Once the workflow is understood, it might probably be much easier to follow all of the above tutorials.

While going the full circle the article also points to some of the common external libraries and how they would come into play: 'immutable', 'normalizr', 'reselect', 'redux-thunk', 'redux-saga', 'redux-promise' and 'redux-persist'.

Please, raise an issue in case you find errors or things to be not clear enough.

Notes

Note, that a one page cheat sheet can not always reflect the general case. This holds true in the following cases:

  1. The store holds the state of the app. The state of the app is typically sliced in slices. A state that is not sliced is a state with a single slice.
  2. An actionCreator() can have a more general interface. If you want to adopt action creators with a common interface, read more about payload in the Flux Standard Action.

Thanks

In case you would like to read detailed comments on this cheat sheet you can go to Redux issue #2254.

Special thanks for improving and correcting this cheat sheet go to:

react-redux-cheatsheet's People

Contributors

majman avatar uanders avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.