𝗛𝗼𝘄 𝗥𝗲𝗱𝘂𝘅 𝗪𝗼𝗿𝗸𝘀 𝗶𝗻 𝗦𝗶𝗺𝗽𝗹𝗲 𝗧𝗲𝗿𝗺𝘀 -> 𝗖𝗼𝗺𝗺𝗲𝗻𝘁 𝗥𝗲𝗱𝘂𝘅 𝗳𝗼𝗻𝗰𝘁𝗶𝗼𝗻𝗻𝗲 𝗲𝗻 𝘀𝗶𝗺𝗽𝗹𝗲𝘀 𝗺𝗼𝘁𝘀
Transmettre des données entre les composants React ressemble souvent à un jeu de téléphone arabe. Vous transmettez des données d'un parent à un enfant, puis à un petit-enfant. Cela devient vite désordonné à mesure que votre application grandit.
Redux résout ce problème. Il crée une source unique de vérité. Au lieu de données éparpillées, tout réside dans un coffre-fort central.
Imaginez un café pour comprendre Redux.
Le Store (Le coffre-fort) C'est le registre du café. Il suit le stock de grains, les commandes et la liste du personnel.
L'Action (La commande)
Un client ne se sert pas un latte directement sur le comptoir. Il passe une commande. Une action est un simple objet qui décrit ce qui s'est passé.
Exemple : { type: 'ADD_TODO', text: 'Buy Milk' }
Le Reducer (Le barista) Le barista est la seule personne autorisée à mettre à jour le registre. Il prend l'état actuel et la nouvelle commande, puis il crée une nouvelle version du registre.
Le Dispatch (Le caissier) Le caissier prend votre commande et la transmet au barista. Le dispatch est la fonction qui envoie votre action au store.
Pourquoi utiliser Redux ?
À mesure que votre application s'étend pour inclure des profils d'utilisateurs ou des paniers d'achat, un store central facilite le débogage. Vous pouvez consulter l'historique de vos actions pour voir quand et pourquoi les données ont changé. Il agit comme une boîte noire pour votre site web.
Résumé :
• Action : Une note décrivant un changement. • Reducer : La logique qui effectue le changement. • Dispatch : Le déclencheur qui envoie l'action à la logique.
Source : https://dev.to/code_with_aravind/how-redux-works-in-simple-terms-1pkp