How do you connect React components to Redux store?

Beginner

Answer

Using React-Redux library:

  1. Wrap app with Provider component
  2. Use useSelector hook to read state
  3. Use useDispatch hook to dispatch actions
// App.js
import { Provider } from 'react-redux';
<Provider store={store}>
  <App />
</Provider>

// Component
import { useSelector, useDispatch } from 'react-redux';
const todos = useSelector(state => state.todos);
const dispatch = useDispatch();