Top 10+ Redux Interview Questions

Most Frequently Asked Redux Interview Questions

  • Single source of truth: The global state of your app is put away in an object tree inside a single store.
  • The state is read-only: State can only be changed by emitting an action, an object that explains what has happened.
  • Changes are made with pure functions: This is to define how the state tree is being transformed by the actions, you have to write pure reducers.
  • It holds the state of the current application from inside
  • With the help of store.getState(); it allows access to the current state.
  • With the help of the store.dispatch(action); it allows the state to be updated.
  • With the help of the store.subscriber(listener); it allows to register listener callbacks.
  • getState()
  • dispatch(action)
  • subscribe(listener)
  • replaceReducer(nextReducer)
import { createStore } from 'redux'
const store = createStore(todos, ['Use Redux'])
store.dispatch(addTodo('Read the docs'))
store.dispatch(addTodo('Read about the middleware'))
import { createStore, applyMiddleware } from 'redux'
const createStoreWithMiddleware = applyMiddleware(ReduxThunk, logger)(createStore);
  • Components: it is used for “dumb” React components that are unfamiliar with Redux.
  • Containers: It is used for “smart” React components which are connected to the Redux.
  • Actions: It is used for all the action creators, where the file name should be corresponding to the part of the app.
  • Reducers: It is used for all the reducers where the file name is corresponding to the state key.
  • Store: it is used for store initialization. This directory works best in small and mid-level size apps.
  • You need to learn the avoiding of mutations: Flux is un-opinionated about mutating the data, however, Redux does not like mutations, and most of the packages which are complementary to Redux should never alter the state.
  • You have to carefully pick your packages: While Flux principle does not try to solve the problems such as undo or redo, persistence, or the forms where Redux has extension points like store enhancers and middleware.
  • No nice Flow integration yet: Flux allows you to do impressive static type checks that Redux does not support yet.
  • Modify its argument
  • Make sure not to perform some side effects such as routing transitions and API calls
  • Call non-pure functions, e.g. Date.now() or Math.random().

Example

const initialState = { value: 0 }function counterReducer(state = initialState, action) {
// Check to see if the reducer cares about this action
if (action.type === 'counter/incremented') {
// If so, make a copy of `state`
return {
...state,
// and update the copy with the new value
value: state.value + 1
}
}
// otherwise return the existing state unchanged
return state
}

--

--

--

Full Stack Developer from India having 8+ year experience https://www.bestinterviewquestion.com

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

cs371p Spring 2022 Blog 7: Gavin Garcia

Laravel and VueJS: How do they complement each other?

Compiling Geant4 to WebAssembly

Express uPort as javascript — Relay transaction to 3rd party Dapp.

Utilizing Associated Classes in a JS Application

Full Stack Typescript with NestJS, Angular and Prisma

5 Tips To Boost Your Development Productivity

React Native Firebase Messaging With Local Push Notifications

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Umesh Singh

Umesh Singh

Full Stack Developer from India having 8+ year experience https://www.bestinterviewquestion.com

More from Medium

Where was Redux when I needed it?

A React Christmas

React Props vs Hooks

Opus Magnum: a Solid Foundation for Understanding: 1) ReactJS Routing; 2) Responsive Routing (what?)

URL adrress parts