Sommaire

Utilisation avec React

Dans l’exemple précédent, vous avez dû penser qu’utiliser Redux était laborieux : beaucoup d’opérations sont nécessaires pour un résultat modeste, etc. Mais c’est en le couplant avec React (ou une autre bibliothèque comme Vue.js ou Angular) que tout son potentiel est visible. Il va nous permettre d’extraire un maximum de logique métier (mise à jour du state, appels à une API, etc.) des composants, pour n’y conserver que leur responsabilité originale : le rendu.

1. Découverte de React-Redux React-Redux

Utiliser Redux comme nous venons de le voir avec un composant React serait tout à fait envisageable. On pourrait par exemple créer notre store, puis le passer en propriété de chaque composant de l’application, qui serait alors en mesure d’afficher des valeurs du state, et de dispatcher des actions. Il y aurait cependant certaines subtilités à gérer, et cela resterait laborieux.

Heureusement, la bibliothèque React-Redux est là pour nous faciliter grandement la tâche. En effet, nous n’aurons pas besoin de nous soucier du store, car elle nous permet de définir pour certains composants :

  • à quels éléments du state nous souhaitons avoir accès (pour les afficher par exemple) ;

  • quelles actions nous souhaitons être mesure de dispatcher.

Reprenons par exemple notre compteur. Créons un composant similaire à ...