Um mit asynchronen Nebenwirkungen in Redux umzugehen, kann man sogenannte Redux Middleware benutzen. Hierbei handelt es sich um eine Funktion, die vor dem Reducer ausgeführt wird und dort die Möglichkeit hat, zusätzliche Aktionen auszuführen oder die aktuelle Aktion zu modifizieren.
Eine sehr populäre Middleware für asynchrone Nebenwirkungen ist Redux Thunk. Thunks sind Funktionen, die andere Funktionen zurückgeben. Redux Thunk ermöglicht es uns, Action Creator-Funktionen zu schreiben, die statt einem Aktionsobjekt eine Funktion zurückgeben. Diese Funktion erhält dann die `dispatch`- und `getState`-Methoden als Parameter, sodass wir auf den aktuellen State zugreifen oder weitere Aktionen auslösen können.
Eine typische Aktions-Erstellungs-Funktion mit Redux Thunk könnte so aussehen:
```javascript
function fetchPosts(subreddit) {
return function(dispatch, getState) {
dispatch(requestPosts(subreddit))
return fetch(`https://www.reddit.com/r/${subreddit}.json`)
.then(response => response.json())
.then(json => dispatch(receivePosts(subreddit, json)))
}
}
```
In diesem Beispiel wird zunächst eine Aktion `requestPosts` abgefeuert, um den Start der asynchronen Anfrage anzuzeigen (z.B. um einen Ladeindikator anzuzeigen). Dann wird die tatsächliche Netzwerkanfrage mit `fetch` ausgeführt. Wenn die Antwort eingetroffen ist, wird eine weitere Aktion `receivePosts` abgefeuert, um den neuen Zustand (die empfangenen Posts) an den Store zu übergeben.
Anstatt Redux Thunk kann man auch andere Middleware wie Redux Saga oder Redux Observable verwenden, je nach Vorlieben und Anforderungen des Projekts. Diese erlauben es, asynchrone Abläufe mit mehr Kontrolle oder auf eine deklarativere Weise zu beschreiben.
