1What is Redux primarily used for in a React application?
A.State management
B.Database management
C.Server-side rendering
D.Routing
Correct Answer: State management
Explanation:
Redux is a predictable state container for JavaScript apps, primarily used for managing application state in a central store.
Incorrect! Try again.
2Which of the following is NOT one of the three fundamental principles of Redux?
A.Changes are made with pure functions
B.State is distributed across components
C.State is read-only
D.Single source of truth
Correct Answer: State is distributed across components
Explanation:
Redux operates on a single source of truth (one store), whereas distributing state across components describes local component state or Context API usage.
Incorrect! Try again.
3In Redux, what is the 'Store'?
A.A function that changes state
B.A middleware for API calls
C.An object that holds the application state
D.A component that renders UI
Correct Answer: An object that holds the application state
Explanation:
The Store is the object that brings actions and reducers together and holds the application state.
Incorrect! Try again.
4What is the purpose of a 'Reducer' in Redux?
A.To send data to the server
B.To reduce the size of the bundle
C.To connect React components to the DOM
D.To specify how the application's state changes in response to actions
Correct Answer: To specify how the application's state changes in response to actions
Explanation:
Reducers are pure functions that take the previous state and an action, and return the next state.
Incorrect! Try again.
5What is the only way to change the state inside a Redux store?
A.Dispatching an action
B.Calling the reducer function directly
C.Using the setState method
D.Directly modifying the state object
Correct Answer: Dispatching an action
Explanation:
According to Redux principles, the state is read-only. The only way to change it is to emit (dispatch) an action describing what happened.
Incorrect! Try again.
6What is an 'Action' in Redux?
A.A connection to the database
B.A plain JavaScript object that describes what happened
C.A method inside a class component
D.A function that returns a component
Correct Answer: A plain JavaScript object that describes what happened
Explanation:
An action is a plain JavaScript object that must have a 'type' property and acts as a payload of information to the store.
Incorrect! Try again.
7Which property is mandatory in a Redux Action object?
A.data
B.type
C.payload
D.id
Correct Answer: type
Explanation:
Actions must have a type property that indicates the type of action being performed.
Incorrect! Try again.
8Which library is commonly used to bind Redux with React?
A.redux-thunk
B.axios
C.react-redux
D.react-router-dom
Correct Answer: react-redux
Explanation:
React Redux is the official React UI binding library for Redux.
Incorrect! Try again.
9What is the purpose of the <Provider> component in react-redux?
A.To debug the application
B.To make the Redux store available to any nested components
C.To provide routing capabilities
D.To provide API data to components
Correct Answer: To make the Redux store available to any nested components
Explanation:
The <Provider> component wraps the React app and makes the Redux store available to any nested component that needs to access the Redux store.
Incorrect! Try again.
10Which prop must be passed to the <Provider> component?
A.action
B.reducer
C.state
D.store
Correct Answer: store
Explanation:
The <Provider> component requires the Redux store to be passed as a prop.
Incorrect! Try again.
11What is the correct signature of a Reducer function?
A.(action, state) => newState
B.(state, action) => newState
C.(state) => newState
D.(state, action) => void
Correct Answer: (state, action) => newState
Explanation:
A reducer is a pure function that takes the current state and an action, and returns the new state.
Incorrect! Try again.
12Why must Reducers be 'pure functions'?
A.To ensure predictable state changes without mutations
B.To ensure the UI renders faster
C.To allow side effects like API calls
D.To allow direct DOM manipulation
Correct Answer: To ensure predictable state changes without mutations
Explanation:
Pure functions do not modify their arguments and have no side effects, which is crucial for Redux's predictability and features like time-travel debugging.
Incorrect! Try again.
13Which method is used to send an action to the store?
A.store.push()
B.store.send()
C.store.update()
D.store.dispatch()
Correct Answer: store.dispatch()
Explanation:
dispatch(action) is the method used to trigger a state change.
Incorrect! Try again.
14What is an 'Action Creator'?
A.A function that connects components
B.A component that triggers an event
C.A function that creates the Redux store
D.A function that returns an action object
Correct Answer: A function that returns an action object
Explanation:
Action creators are simply functions that create and return an action object to avoid writing the object manually every time.
Incorrect! Try again.
15In the connect function connect(mapStateToProps, mapDispatchToProps)(MyComponent), what is the purpose of mapStateToProps?
A.To initialize local component state
B.To connect the component to the router
C.To extract data from the Redux store and pass it as props to the component
D.To map React props to Redux actions
Correct Answer: To extract data from the Redux store and pass it as props to the component
Explanation:
mapStateToProps allows a component to subscribe to Redux store updates and select the part of the data it needs.
Incorrect! Try again.
16Which React-Redux hook is synonymous with mapStateToProps?
A.useSelector
B.useDispatch
C.useReducer
D.useStore
Correct Answer: useSelector
Explanation:
useSelector is a hook that allows you to extract data from the Redux store state, similar to mapStateToProps.
Incorrect! Try again.
17Which React-Redux hook is used to dispatch actions?
A.useSelector
B.useAction
C.useDispatch
D.useSend
Correct Answer: useDispatch
Explanation:
useDispatch returns a reference to the dispatch function from the Redux store.
Incorrect! Try again.
18What is the typical initial value of the state in a Reducer?
A.Undefined
B.Defined via a default parameter
C.Null
D.The entire database
Correct Answer: Defined via a default parameter
Explanation:
Reducers usually define an initialState variable and set it as the default value for the state argument (e.g., state = initialState).
Incorrect! Try again.
19What function is used to combine multiple reducers into a single root reducer?
A.rootReducer
B.mergeReducers
C.combineReducers
D.joinReducers
Correct Answer: combineReducers
Explanation:
combineReducers is a helper function from Redux that turns an object whose values are different reducing functions into a single reducing function.
Incorrect! Try again.
20In the Redux flow, what happens immediately after an action is dispatched?
A.The component re-renders
B.The store calls the reducer function
C.The view updates
D.The action is sent to the server
Correct Answer: The store calls the reducer function
Explanation:
Once an action is dispatched, the store calls the reducer function with the current state and the dispatched action.
Incorrect! Try again.
21What should a reducer return if it receives an action type it does not handle?
A.undefined
B.null
C.The current state
D.An empty object
Correct Answer: The current state
Explanation:
If a reducer doesn't recognize the action type, it must return the current state unchanged.
Incorrect! Try again.
22Which statement regarding Redux state immutability is true?
A.You should use state.push() to add items to an array
B.You should use state.value = 5 to update values
C.You should return a new object/array using spread operators or similar techniques
D.Redux automatically handles mutation for you
Correct Answer: You should return a new object/array using spread operators or similar techniques
Explanation:
Redux requires state updates to be immutable. You cannot modify the existing state object; you must return a new copy with the changes.
Incorrect! Try again.
23What is the 'payload' in an action?
A.Additional data needed to update the state
B.The type of the action
C.The store object
D.The reducer function
Correct Answer: Additional data needed to update the state
Explanation:
The payload property carries the data necessary to perform the state update (e.g., the ID of an item to delete or the new user data to add).
Incorrect! Try again.
24Which tool is widely used for debugging Redux applications in the browser?
A.Node Debugger
B.Redux DevTools Extension
C.React Developer Tools
D.Chrome Task Manager
Correct Answer: Redux DevTools Extension
Explanation:
Redux DevTools Extension allows developers to inspect every state and action payload, and perform time-travel debugging.
Incorrect! Try again.
25What is 'Time Travel Debugging' in Redux?
A.Setting breakpoints in the future
B.Predicting future states using AI
C.Jumping back and forth between different states recorded by the DevTools
D.Running the app in a slower timeframe
Correct Answer: Jumping back and forth between different states recorded by the DevTools
Explanation:
Time travel debugging allows you to revert the app to a previous state by cancelling actions or replaying them to see how the state evolved.
Incorrect! Try again.
26Which npm command is typically used to build a React app for production?
A.npm start
B.npm run build
C.npm test
D.npm run deploy
Correct Answer: npm run build
Explanation:
npm run build executes the build script (usually created by Create React App) to bundle the app for production.
Incorrect! Try again.
27What is the main advantage of the 'production build' of a React app?
A.It includes full error logging
B.It includes hot reloading
C.It runs on a development server
D.It is minified and optimized for performance
Correct Answer: It is minified and optimized for performance
Explanation:
A production build bundles files, minifies code (removes whitespace/comments), and optimizes assets to ensure the app loads fast for users.
Incorrect! Try again.
28Where are the production files typically stored after running the build command?
A./src
B./node_modules
C./build or /dist
D./public
Correct Answer: /build or /dist
Explanation:
Create React App creates a build folder (sometimes dist in other tools like Vite) containing the static files ready for deployment.
Incorrect! Try again.
29What is a 'store subscriber'?
A.A component that dispatches actions
B.A library for routing
C.A function that runs whenever the state is updated
D.A user who pays for the app
Correct Answer: A function that runs whenever the state is updated
Explanation:
store.subscribe(listener) allows you to register a callback listener that triggers whenever an action is dispatched and the state tree might have changed.
Incorrect! Try again.
30When debugging a React app, what does 'Source Map' allow you to do?
A.View the original source code instead of the minified code in the browser
B.Map components to Redux store
C.Map API endpoints to routes
D.Visualise the component tree structure
Correct Answer: View the original source code instead of the minified code in the browser
Explanation:
Source maps map the compressed/minified code back to the original source code, allowing you to debug the actual code you wrote.
Incorrect! Try again.
31In mapDispatchToProps, if the argument is an object of action creators, what does connect do automatically?
A.It wraps the action creators in a dispatch call
B.It validates the prop types
C.It calls the reducers
D.It ignores them
Correct Answer: It wraps the action creators in a dispatch call
Explanation:
If mapDispatchToProps is an object, connect wraps each function with dispatch so you can call them directly as props.
Incorrect! Try again.
32What is the file 'index.js' (or main.jsx) typically used for in a Redux setup?
A.Storing CSS styles
B.Creating action creators
C.Rendering the App component wrapped in the Provider
D.Defining all reducers
Correct Answer: Rendering the App component wrapped in the Provider
Explanation:
The entry point file is typically where the Redux Store is created and passed to the <Provider>, which wraps the root <App />.
Incorrect! Try again.
33What is 'Redux Middleware'?
A.A tool for server-side rendering
B.A CSS framework
C.A database driver
D.Software that sits between the dispatching of an action and the moment it reaches the reducer
Correct Answer: Software that sits between the dispatching of an action and the moment it reaches the reducer
Explanation:
Middleware provides a third-party extension point between dispatching an action and the moment it reaches the reducer (e.g., for logging or async requests).
Incorrect! Try again.
34Which of the following is a common middleware used for async actions in Redux?
A.Redux-Router
B.Redux-Sync
C.Redux-DevTools
D.Redux-Thunk
Correct Answer: Redux-Thunk
Explanation:
Redux Thunk is a standard middleware that allows you to write action creators that return a function instead of an action, enabling async logic.
Incorrect! Try again.
35If a React app crashes in production, which React feature can display a fallback UI instead of the crash?
A.Redux Store
B.Error Boundaries
C.Try-Catch Blocks in render
D.Service Workers
Correct Answer: Error Boundaries
Explanation:
Error boundaries are React components that catch JavaScript errors anywhere in their child component tree and display a fallback UI.
Incorrect! Try again.
36What does process.env.NODE_ENV usually return in a production build?
A.'test'
B.'production'
C.'debug'
D.'development'
Correct Answer: 'production'
Explanation:
Build tools set NODE_ENV to 'production' during the build process to disable development-specific warnings and enable optimizations.
Incorrect! Try again.
37When connecting a component, what happens if you pass null instead of mapStateToProps?
A.The application will crash
B.The component will not receive dispatch prop
C.The component receives the whole state
D.The component will not subscribe to store updates
Correct Answer: The component will not subscribe to store updates
Explanation:
Passing null tells connect that this component does not need to listen to the store state, optimizing performance.
Incorrect! Try again.
38What is the purpose of bindActionCreators?
A.To bind this context to components
B.To create the store
C.To wrap action creators in dispatch so they can be invoked directly
D.To combine multiple reducers
Correct Answer: To wrap action creators in dispatch so they can be invoked directly
Explanation:
bindActionCreators turns an object whose values are action creators, into an object with the same keys, but with every action creator wrapped into a dispatch call.
Incorrect! Try again.
39Which folder in a standard React structure usually contains Redux logic?
A./public
B./redux or /store
C./features
D./assets
Correct Answer: /redux or /store
Explanation:
While structure varies (e.g., feature folders), a dedicated /redux, /store, or /actions & /reducers folder is standard convention.
Incorrect! Try again.
40Why is using console.log for debugging sometimes inefficient in Redux?
A.It cannot print objects
B.It clutters the code and doesn't show the state history easily compared to DevTools
C.It stops the code execution
D.It is not supported in Chrome
Correct Answer: It clutters the code and doesn't show the state history easily compared to DevTools
Explanation:
Redux DevTools provides a structured history, state diffs, and time travel, which is far superior to manual logging.
Incorrect! Try again.
41In the Flux architecture (which Redux simplifies), flow is always:
A.Recursive
B.Unidirectional
C.Bi-directional
D.Random
Correct Answer: Unidirectional
Explanation:
Redux follows strict unidirectional data flow: Action -> Dispatch -> Reducer -> Store -> View.
Incorrect! Try again.
42How can you access the Redux store directly (though not recommended for UI rendering) outside of a component?
A.window.store
B.React.useStore()
C.import store and use store.getState()
D.You cannot access it
Correct Answer: import store and use store.getState()
Explanation:
You can import the created store object into other files and call store.getState() to read the current state snapshot.
Incorrect! Try again.
43What is 'Hot Module Replacement' (HMR) helpful for?
A.Replacing the Redux store in production
B.Swapping modules in a running app without a full reload during development
C.Deploying the app to a server
D.Encrypting data
Correct Answer: Swapping modules in a running app without a full reload during development
Explanation:
HMR allows developers to see changes in CSS or JS immediately without losing the application state (like the Redux store state).
Incorrect! Try again.
44Which method allows you to unsubscribe a listener from the store?
A.store.removeListener()
B.store.unsubscribe()
C.store.off()
D.The function returned by store.subscribe()
Correct Answer: The function returned by store.subscribe()
Explanation:
store.subscribe returns a function that, when called, unregisters the listener.
Incorrect! Try again.
45When preparing for deployment, what is 'minification'?
A.Reducing the functionality of the app
B.Converting React to HTML
C.Removing unused code, shortening variable names, and removing whitespace
Minification reduces file size to speed up download times for the user.
Incorrect! Try again.
46Which hook would you use to perform a side-effect (like data fetching) in a functional component before dispatching an action?
A.useReducer
B.useMemo
C.useEffect
D.useState
Correct Answer: useEffect
Explanation:
useEffect is used for side effects. You would fetch data inside useEffect and then dispatch a Redux action with the result.
Incorrect! Try again.
47What is the concept of 'Single Source of Truth' in Redux?
A.The entire state of the application is stored in an object tree within a single store
B.The database is the only truth
C.The API is the source of truth
D.Every component has its own store
Correct Answer: The entire state of the application is stored in an object tree within a single store
Explanation:
This principle simplifies debugging and inspecting the application since all state resides in one place.
Incorrect! Try again.
48If you want to deploy your React app to a static host (like GitHub Pages or Netlify), what is the primary requirement?
A.A Node.js backend
B.A Docker container
C.A MySQL database
D.The built static files (HTML, CSS, JS)
Correct Answer: The built static files (HTML, CSS, JS)
Explanation:
Static hosts serve pre-built HTML/CSS/JS files generated by npm run build; they do not execute server-side code.
Incorrect! Try again.
49What is the role of redux-logger?
A.To log every action and the next state to the console
B.To log user login times
C.To manage login state
D.To log errors to a server
Correct Answer: To log every action and the next state to the console
Explanation:
redux-logger is a middleware that logs dispatched actions and the resulting state change to the console for debugging.
Incorrect! Try again.
50Why shouldn't you mutate state directly (e.g., state.value++) in Redux?
A.It deletes the store
B.It makes the app slower
C.It throws a syntax error
D.Redux won't detect the change and components won't re-render
Correct Answer: Redux won't detect the change and components won't re-render
Explanation:
Redux uses shallow equality checking. If the object reference doesn't change (which happens in mutation), Redux assumes state hasn't changed and won't update the UI.