Redux/Redux Toolkit Assignment – 1

Basic Questions

  1. Install Redux in a project using npm install redux.
  2. Create a Redux store using createStore().
  3. Define an initial state object with {count: 0}.
  4. Write a simple reducer function to increment the count.
  5. Create an action object { type: “INCREMENT” }.
  6. Dispatch the INCREMENT action and log the updated state.
  7. Write a reducer that handles both INCREMENT and DECREMENT actions.
  8. Access the current state using store.getState().
  9. Subscribe to the store and log whenever the state changes.
  10. Create a constant variable for action types instead of using strings directly.
  11. Write a reducer that returns a new state object instead of mutating the old one.
  12. Show the difference between mutating an array vs returning a new one with spread operator.
  13. Create a reducer managing a list of todos (ADD_TODO).
  14. Ensure a reducer never modifies the original state by using object spread {…state}.
  15. Write a reducer for toggling a boolean flag (TOGGLE_THEME).
  16. Add Redux DevTools extension enhancer when creating a store.
  17. Monitor actions using Redux DevTools and identify state changes.
  18. Use console.log() inside a reducer to debug action flow.
  19. Write a simple action creator function increment() that returns {type: “INCREMENT”}.
  20. Practice connecting Redux store in a basic React project with <Provider>.

Intermediate Questions

  1. Create a reducer for a shopping cart (ADD_ITEM, REMOVE_ITEM).
  2. Write a reducer managing authentication state (LOGIN, LOGOUT).
  3. Implement a reducer that handles a RESET state action.
  4. Combine multiple reducers using combineReducers().
  5. Add separate reducers for users and products and merge them.
  6. Dispatch multiple actions in sequence and observe the state changes.
  7. Create a counter app with Redux and display count in React component.
  8. Implement a reducer to manage notifications (add, remove).
  9. Write a reducer that updates a nested object property immutably.
  10. Replace an item in an array immutably using map().
  11. Remove an object from an array immutably using filter().
  12. Explain why returning state from a reducer without change is important.
  13. Record a session of dispatched actions in Redux DevTools timeline.
  14. Time-travel between dispatched actions using DevTools.
  15. Identify and fix an action type typo (“INCREMNT” vs “INCREMENT”) via debugging.
  16. Install and set up redux-thunk middleware with applyMiddleware().
  17. Write an async action creator that fetches data from an API and dispatches SUCCESS or FAILURE.
  18. Create loading, success, and error states for async data fetching with Redux.
  19. Monitor how async actions flow in Redux DevTools.
  20. Implement a middleware that logs every dispatched action to the console.

Advanced Questions

  1. Build a Redux-powered todo list app with add, toggle, and delete features.
  2. Implement a multi-reducer store (auth, products, cart) and manage shared state.
  3. Use redux-thunk to fetch product data from an API and update the store.
  4. Add error handling for failed API requests in Redux.
  5. Write custom middleware that checks if an action type is ASYNC and logs a warning.
  6. Use Redux DevTools to rewind actions and identify a state regression bug.
  7. Optimize a Redux reducer by splitting a large state tree into smaller reducers.
  8. Analyze performance impact of unnecessary re-renders caused by mutable state.
  9. Build a Redux-based Authentication Flow (login/logout + JWT simulation).
  10. Create a dashboard app where API data (users, posts) is fetched via thunks and displayed with different reducers.