Top AI Repos — open-source AI, indexed and scored
Top AI Repos tracks AI repositories on GitHub and answers two different questions about each one: is it moving right now, and would you bet a product on it.
Top AI Repos tracks AI repositories on GitHub and answers two different questions about each one: is it moving right now, and would you bet a product on it.
:boom: Comprehensive Notes for Learning (how to use) Redux to manage state in your Web/Mobile (React.js) Apps.
| Date | Stars |
|---|---|
| 2026-07-24 | 445 |
| 2026-07-25 | 445 |
| 2026-07-28 | 445 |
| 2026-07-30 | 445 |
| 2026-08-06 | 445 |
Today
— stars today
This week
— stars this week
This month
— stars this month
Momentum
0.0
growth rate 0.00%/day
# Learn Redux
Redux simplifies writing **well-structured**, ***predictable***, ***testable*** & ***maintainable*** JavaScript Web Applications.
> **Note**: this guide is aimed at people who already have "***intermediate***" ***JavaScript experience***.
> e.g. you have already built a couple of small apps without
> using a framework and/or have used an older more complex library such as Angular, Ember, Backbone or Flux.
> If you are just *starting* out on your web programming journey,
> we *recommend* you checkout:
> [https://github.com/dwyl/start-here#**javascript**](https://github.com/dwyl/start-here#javascript)
> ***first***
and *then* come *back* here!
> Bookmark/Star this GitHub repository so you don't forget where it is!
## Why?
JavaScript web applications can become messy if
they don't have a *clear* organisation from the beginning.
**Redux** is an ***elegant*** way
to ***structure*** your **JavaScript web applications**.
Having built *many* web applications over the past few years
using *all* the most popular frameworks/libraries, we were *delighted*
to discover Redux's *refreshingly simple approach*.
While there is an ***initial learning curve***
we feel the *simplicity*
of the *single* `store` (*snapshot of your app's state*)
and applying changes to your app
by *dispatching* succinct *functional* ***actions***
offers a ***significant***
**benefit** over other ways of organising your code.
> *Please, don't take our word for it,
skim through the notes we have made and*
***always decide for yourself***.
## What?
Redux[<sup>1</sup>](https://github.com/dwyl/learn-redux/issues/22) *borrows the* ***reducer pattern*** *from*
[***Elm*** Architecture](https://github.com/evancz/elm-architecture-tutorial/)
which simplifies writing web apps.
If you have *never heard of Elm*, ***don't worry***,
you *don't need* to go read another doc before you can understand this...
Just keep reading and (*hopefully*) everything will become clear.
> _If **anything** is **unclear**,
**please tell us** where you are stuck **so we can help**_!
[](https://gitter.im/dwyl/chat?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
### Three Principals
Redux is based on three principals.
see: https://redux.js.org/understanding/thinking-in-redux/three-principles
#### 1. *Single* Source of Truth
The state of your whole application is stored in a single object tree; the "Store".
This makes it *much* easier to keep track of the "*State*" of your application
at any time and roll back to any previous state.
> If its not *intermediately* obvious why this is a good thing,
we *urge* you to have faith and keep reading...
#### 2. State is *Read-Only* ("*Immutable*")
Instead of directly updating data in the store, we describe the update
as a function which gets applied to the existing store and returns a new version.
> See: https://en.wikipedia.org/wiki/Immutable_object
#### 3. Changes are made Using *Pure Functions*
To change the state tree we use "*actions*" called "*reducers*",
these are simple functions which perform a *single* action.
<br />
#### tl;dr
Read more about JavaScript's Reduce (Array method):
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
and how to reduce an array of Objects:
https://stackoverflow.com/questions/5732043/javascript-reduce-on-array-of-objects
understanding these two things will help you grasp why Redux is so simple.
You will see this abbreviated/codified as `(state, action) => state`
to understand what this means, watch: [youtu.be/xsSnOQynTHs?t=15m51s](https://youtu.be/xsSnOQynTHs?t=15m51s)
## How?
### Learn Where Redux Got It's _Best_ Ideas FromExcerpt of 12,505 characters
Read on GitHubWould you bet a product on this? Bounded 0–100 and slow moving.
matched fp:fae7b299d644ec36, topic:tutorial, readme:tutorial