For at begynde at bruge Redux Toolkit skal du installere det sammen med React-bindings.

Kør følgende kommando i dit projekt:

npm install @reduxjs/toolkit react-redux

Dette installerer alt, hvad du behøver for at oprette en store og forbinde den til din React-app.

Opsætning af store

Opret en ny fil til store. En almindelig placering er:

src/store/store.js

Inde i denne fil opretter du store ved hjælp af configureStore:

import { configureStore } from '@reduxjs/toolkit';

export const store = configureStore({
  reducer: {}
});

På dette tidspunkt er store tom. Du tilføjer reducers til den i de næste kapitler.

Tilslutning af Redux til React

For at gøre store tilgængelig i din app, skal du omvikle din root-komponent med Provider.

Åbn din hovedindgangsfil (for eksempel main.jsx eller index.js) og opdater den således:

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>
);

Nu er Redux store tilgængelig i alle komponenter.