Redux & Redux Toolkit
/Intermediate
Async Actions
Definition
Actions in Redux that involve asynchronous operations (like fetching data from a server). Because pure reducers cannot handle promises, middleware is required to process them.
Explain Like I'm New
Redux is impatient. When you dispatch an action, the Reducer runs instantly. If you dispatch an API call that takes 2 seconds, Redux throws an error. You need an 'Async Action' (a Thunk) which pauses Redux, waits 2 seconds for the data, and THEN dispatches the real action.
Real World Example
Fetching a list of products from a database. You dispatch `fetchProducts()`. Redux waits for the network request to finish, and then places the products into the store.
Common Use Cases
- •Fetching API data
- •Timers (setTimeout)
- •Complex multi-step logic
Interactive Example
Loading...
Console output will appear here...
Interview Questions
basic
- Can you put a `fetch()` call directly inside a Reducer?
intermediate
- What is the most popular middleware used to handle Async Actions in Redux?