Redux & Redux Toolkit
/Intermediate
Pending/Fulfilled/Rejected States
Definition
The three standard lifecycle states of a Promise, which `createAsyncThunk` maps directly into Redux action types to manage UI loading spinners and error messages.
Explain Like I'm New
Every API call goes through 3 phases: 1. Pending: The request is flying through the internet. Show a loading spinner. 2. Fulfilled: The data arrived safely! Show the data. 3. Rejected: The server crashed. Show a red error message.
Real World Example
When you click 'Login', the state changes to `pending` and the button greys out. If your password is wrong, it changes to `rejected` and displays 'Invalid Password'.
Common Use Cases
- •Managing UI loading states
- •Handling API errors gracefully
Interactive Example
Loading...
Console output will appear here...
Interview Questions
basic
- What action type does `createAsyncThunk` dispatch the exact moment the API call starts?
intermediate
- If a Promise inside the thunk throws an error, which action is dispatched?