Flux design pattern and several core design pattern principles - FadiZahhar/reduxJquery GitHub Wiki

Key Design Pattern Principles in Redux

1. Unidirectional Data Flow (Flux)

• All data flows in a single direction: Action → Dispatcher → Store → View
• In Redux: Action → Reducer → Store (state) → View

2. Command Pattern

• Actions in Redux are like “commands” that describe what happened in the application.

3. Observer Pattern

• The store lets you "subscribe" to state changes, similar to an Observer.

4. Mediator Pattern

• The Redux store acts as a mediator between actions (commands) and reducers (state changers).

---

Main Pattern: Flux (Unidirectional Data Flow)

Redux is heavily inspired by Facebook’s [Flux architecture](https://facebook.github.io/flux/). Redux simplifies and streamlines Flux, focusing on pure functions and a single store.

---

References for the Design Pattern Principle

1. Redux Docs: Motivation

   • https://redux.js.org/introduction/motivation

2. Redux Docs: Three Principles

   • https://redux.js.org/introduction/three-principles

3. Flux Architecture (Official Facebook Docs)

   • https://facebook.github.io/flux/docs/in-depth-overview/

4. Refactoring Guru: Observer Pattern

   • https://refactoring.guru/design-patterns/observer

5. Refactoring Guru: Command Pattern

   • https://refactoring.guru/design-patterns/command

6. Refactoring Guru: Mediator Pattern

   • https://refactoring.guru/design-patterns/mediator

7. Patterns: Unidirectional Data Flow

   • https://martinfowler.com/articles/201701-event-driven.html

---

Summary Statement

When you use Redux, you’re following the principles of the Flux architecture—specifically, unidirectional data flow, command/observer patterns, and centralizing your state for predictable updates.

Redux is not just a library, but a concrete implementation of these well-established design pattern principles.