InterviewHubPRO
Section Overview
Q338

Question 338 of 445

Part 10: Modern React 18, React 19 & Next.js Patterns (317 - 353)

76%
React & Modern Frontend (445 Qs)•Part 10: Modern React 18, React 19 & Next.js Patterns (317 - 353)

How would you structure Redux in a large application?

The recommended approach (and what Redux Toolkit is designed around) is a "feature folder" / "ducks" structure rather than splitting by technical type (actions/, reducers/, constants/):

bash
src/
app/
  store.js            # configureStore() + root reducer wiring
features/
  posts/
    postsSlice.js     # createSlice: reducer + actions + thunks
    postsSelectors.js # createSelector-based selectors
    PostList.jsx       # components using useSelector/useDispatch
  users/
    usersSlice.js
    usersSelectors.js

Guidelines:

  1. Colocate a feature's slice, selectors, thunks, and components in one folder instead of scattering related code across parallel actions/reducers/constants folders.
  2. One slice per domain concept (posts, users, cart), created with createSlice, combined once in store.js.
  3. Keep components decoupled from the store shape by reading data only through selectors, never state.posts.entities directly in a component.
  4. Normalize related/nested data (see Q336) so features can reference each other by ID instead of duplicating data.
  5. Use RTK Query (or a dedicated API slice) for server state, and keep hand-written slices for genuine client/app state.