Sommaire

Découverte de Redux

Avant de nous lancer dans un exemple mettant en œuvre Redux, parcourons rapidement quelques concepts qu’il définit afin de comprendre comment il fonctionne. Il faut savoir que ce fonctionnement est en réalité très simple, mais comme souvent les choses les plus simples permettent, mises bout à bout, d’arriver aux solutions les plus élégantes.

1. Concepts de base

a. Le state State:Redux

L’élément le plus important de Redux est le state. C’est en effet sa principale fonction : stocker l’état d’une application. Les données qu’il stocke peuvent être de tout type : objets, nombres, tableaux, fonctions, etc. Le state peut être lu (par un composant React ou autre) ; en revanche, il ne sera jamais modifié directement. Nous allons devoir indiquer à Redux comment en générer la version  suivante.

b. Les actions Actions

Afin de mettre à jour le state, la première étape sera de déclencher une action, par exemple au clic sur un bouton. On dira alors que l’action est dispatchée. Une action doit être un objet, constitué d’un type, et éventuellement d’autres données.

L’idéal est de concevoir une action comme un verbe, associé à des paramètres. Par exemple, si le state contient un compteur (exemple classique d’introduction à Redux), on pourrait avoir les actions incrémenter ...