2. What is the difference between redux-thunk and createAsyncThunk?

Question

Accepted Answer

`redux-thunk` and `createAsyncThunk` both handle asynchronous logic in Redux, but they differ in abstraction, boilerplate, and ease of use. `redux-thunk` is a middleware that allows you to manually write async logic, while `createAsyncThunk` is a Redux Toolkit utility that automates the async action lifecycle. **1. Level of Abstraction:** `redux-thunk` is a low-level middleware requiring manual setup for async actions. `createAsyncThunk` abstracts that setup by generating pending, fulfilled, and rejected action types automatically. **2. Boilerplate:** With `redux-thunk`, you manually dispatch multiple actions for loading, success, and failure. `createAsyncThunk` eliminates that boilerplate. **3. Integration with createSlice:** `createAsyncThunk` integrates seamlessly with Redux Toolkit slices via `extraReducers`, while `redux-thunk` requires custom reducers. **4. Error Handling:** `createAsyncThunk` includes built-in error propagation via the rejected action payload, while `redux-thunk` requires custom try-catch handling. const fetchUser = (userId) => async (dispatch) => {
  dispatch({ type: 'user/fetchStart' });
  try {
    const response = await fetch(`/api/users/${userId}`);
    const data = await response.json();
    dispatch({ type: 'user/fetchSuccess', payload: data });
  } catch (error) {
    dispatch({ type: 'user/fetchFailure', error });
  }
}; import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';

export const fetchUser = createAsyncThunk('user/fetch', async (userId) => {
  const response = await fetch(`/api/users/${userId}`);
  return response.json();
});

2. What is the difference between redux-thunk and createAsyncThunk?

Difference Between redux-thunk and createAsyncThunk in Redux Toolkit

2. What is the difference between redux-thunk and createAsyncThunk?

Difference Between redux-thunk and createAsyncThunk in Redux Toolkit

Scenario Questions

Follow-up Questions