Connexion de Redux à React avec Provider

Pour utiliser Redux dans vos composants, il est nécessaire de connecter votre application React au store.

Cela se fait à l'aide du composant Provider provenant de 'react-redux'.

Enveloppement de l'application

Ouvrez votre fichier d'entrée principal, généralement main.jsx ou index.js, et enveloppez votre application avec Provider :

import React from 'react';
import ReactDOM from 'react-dom/client';
import { Provider } from 'react-redux';
import { store } from './store/store';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')).render(
  <Provider store={store}>
    <App />
  </Provider>
);

Rôle du Provider

Provider rend le store accessible à l'ensemble de l'application. Une fois l'application enveloppée, tout composant peut accéder à l'état ou dispatcher des actions sans avoir à transmettre les données à travers plusieurs couches.

Sans Provider, vos composants ne connaîtraient pas le store. Cette connexion permet à Redux de fonctionner à travers toute l'application plutôt qu'à l'intérieur d'un seul composant.