React Interview Questions & Answers

Questions Table

Table of Contents

No.QuestionsAnswer
Core Reactfalse
1What is React?false
2What are the major features of React?false
3What is JSX?false
4What is the difference between Element and Component?false
5How to create components in React?false
6When to use a Class Component over a Function Component?false
7What are Pure Components?false
8What is state in React?false
9What are props in React?false
10What is the difference between state and props?false
11Why should we not update the state directly?false
12What is the purpose of callback function as an argument of setState()?false
13What is the difference between HTML and React event handling?false
14How to bind methods or event handlers in JSX callbacks?false
15How to pass a parameter to an event handler or callback?false
16What are synthetic events in React?false
17What are inline conditional expressions?false
18What is "key" prop and what is the benefit of using it in arrays of elements?false
19What is the use of refs?false
20How to create refs?false
21What are forward refs?false
22Which is preferred option with in callback refs and findDOMNode()?false
23Why are String Refs legacy?false
24What is Virtual DOM?false
25How Virtual DOM works?false
26What is the difference between Shadow DOM and Virtual DOM?false
27What is React Fiber?false
28What is the main goal of React Fiber?false
29What are controlled components?false
30What are uncontrolled components?false
31What is the difference between createElement and cloneElement?false
32What is Lifting State Up in React?false
33What are the different phases of component lifecycle?false
34What are the lifecycle methods of React?false
35What are Higher-Order components?false
36How to create props proxy for HOC component?false
37What is context?false
38What is children prop?false
39How to write comments in React?false
40What is the purpose of using super constructor with props argument?false
41What is reconciliation?false
42How to set state with a dynamic key name?false
43What would be the common mistake of function being called every time the component renders?false
44Is lazy function supports named exports?false
45Why React uses className over class attribute?false
46What are fragments?false
47Why fragments are better than container divs?false
48What are portals in React?false
49What are stateless components?false
50What are stateful components?false
51How to apply validation on props in React?false
52What are the advantages of React?false
53What are the limitations of React?false
54What are error boundaries in React v16false
55How error boundaries handled in React v15?false
56What are the recommended ways for static type checking?false
57What is the use of react-dom package?false
58What is the purpose of render method of react-dom?false
59What is ReactDOMServer?false
60How to use InnerHtml in React?false
61How to use styles in React?false
62How events are different in React?false
63What will happen if you use setState in constructor?false
64What is the impact of indexes as keys?false
65Is it good to use setState() in componentWillMount() method?false
66What will happen if you use props in initial state?false
67How do you conditionally render components?false
68Why we need to be careful when spreading props on DOM elements??false
69How you use decorators in React?false
70How do you memoize a component?false
71How you implement Server-Side Rendering or SSR?false
72How to enable production mode in React?false
73What is CRA and its benefits?false
74What is the lifecycle methods order in mounting?false
75What are the lifecycle methods going to be deprecated in React v16?false
76What is the purpose of getDerivedStateFromProps() lifecycle method?false
77What is the purpose of getSnapshotBeforeUpdate() lifecycle method?false
78Do Hooks replace render props and higher order components?false
79What is the recommended way for naming components?false
80What is the recommended ordering of methods in component class?false
81What is a switching component?false
82Why we need to pass a function to setState()?false
83What is strict mode in React?false
84What are React Mixins?false
85Why is isMounted() an anti-pattern and what is the proper solution?false
86What are the Pointer Events supported in React?false
87Why should component names start with capital letter?false
88Are custom DOM attributes supported in React v16?false
89What is the difference between constructor and getInitialState?false
90Can you force a component to re-render without calling setState?false
91What is the difference between super() and super(props) in React using ES6 classes?false
92How to loop inside JSX?false
93How do you access props in attribute quotes?false
94What is React PropType array with shape?false
95How to conditionally apply class attributes?false
96What is the difference between React and ReactDOM?false
97Why ReactDOM is separated from React?false
98How to use React label element?false
99How to combine multiple inline style objects?false
100How to re-render the view when the browser is resized?false
101What is the difference between setState and replaceState methods?false
102How to listen to state changes?false
103What is the recommended approach of removing an array element in react state?false
104Is it possible to use React without rendering HTML?false
105How to pretty print JSON with React?false
106Why you can't update props in React?false
107How to focus an input element on page load?false
108What are the possible ways of updating objects in state?false
110How can we find the version of React at runtime in the browser?false
111What are the approaches to include polyfills in your create-react-app?false
112How to use https instead of http in create-react-app?false
113How to avoid using relative path imports in create-react-app?false
114How to add Google Analytics for react-router?false
115How to update a component every second?false
116How do you apply vendor prefixes to inline styles in React?false
117How to import and export components using react and ES6?false
118What are the exceptions on React component naming?false
119Why is a component constructor called only once?false
120How to define constants in React?false
121How to programmatically trigger click event in React?false
122Is it possible to use async/await in plain React?false
123What are the common folder structures for React?false
124What are the popular packages for animation?false
125What is the benefit of styles modules?false
126What are the popular React-specific linters?false
127How to make AJAX call and In which component lifecycle methods should I make an AJAX call?false
128What are render props?false
React Routerfalse
129What is React Router?false
130How React Router is different from history library?false
131What are the <Router> components of React Router v4?false
132What is the purpose of push and replace methods of history?false
133How do you programmatically navigate using React router v4?false
134How to get query parameters in React Router v4false
135Why you get "Router may have only one child element" warning?false
136How to pass params to history.push method in React Router v4?false
137How to implement default or NotFound page?false
138How to get history on React Router v4?false
139How to perform automatic redirect after login?false
React Internationalizationfalse
140What is React-Intl?false
141What are the main features of React Intl?false
142What are the two ways of formatting in React Intl?false
143How to use FormattedMessage as placeholder using React Intl?false
144How to access current locale with React Intlfalse
145How to format date using React Intl?false
React Testingfalse
146What is Shallow Renderer in React testing?false
147What is TestRenderer package in React?false
148What is the purpose of ReactTestUtils package?false
149What is Jest?false
150What are the advantages of Jest over Jasmine?false
151Give a simple example of Jest test casefalse
React Reduxfalse
152What is Flux?false
153What is Redux?false
154What are the core principles of Redux?false
155What are the downsides of Redux compared to Flux?false
156What is the difference between mapStateToProps() and mapDispatchToProps()?false
157Can I dispatch an action in reducer?false
158How to access Redux store outside a component?false
159What are the drawbacks of MVW patternfalse
160Are there any similarities between Redux and RxJS?false
161How to dispatch an action on load?false
162How to use connect from React Redux?false
163How to reset state in Redux?false
164Whats the purpose of at symbol in the redux connect decorator?false
165What is the difference between React context and React Redux?false
166Why are Redux state functions called reducers?false
167How to make AJAX request in Redux?false
168Should I keep all component's state in Redux store?false
169What is the proper way to access Redux store?false
170What is the difference between component and container in React Redux?false
171What is the purpose of the constants in Redux?false
172What are the different ways to write mapDispatchToProps()?false
173What is the use of the ownProps parameter in mapStateToProps() and mapDispatchToProps()?false
174How to structure Redux top level directories?false
175What is redux-saga?false
176What is the mental model of redux-saga?false
177What are the differences between call and put in redux-sagafalse
178What is Redux Thunk?false
179What are the differences between redux-saga and redux-thunkfalse
180What is Redux DevTools?false
181What are the features of Redux DevTools?false
182What are Redux selectors and Why to use them?false
183What is Redux Form?false
184What are the main features of Redux Form?false
185How to add multiple middlewares to Redux?false
186How to set initial state in Redux?false
187How Relay is different from Redux?false
188What is an action in Redux?false
React Nativefalse
188What is the difference between React Native and React?false
189How to test React Native apps?false
190How to do logging in React Native?false
191How to debug your React Native?false
React supported libraries and Integrationfalse
192What is reselect and how it works?false
193What is Flow?false
194What is the difference between Flow and PropTypes?false
195How to use font-awesome icons in React?false
196What is React Dev Tools?false
197Why is DevTools not loading in Chrome for local files?false
198How to use Polymer in React?false
199What are the advantages of React over Vue.js?false
200What is the difference between React and Angular?false
201Why React tab is not showing up in DevTools?false
202What are styled components?false
203Give an example of Styled Components?false
204What is Relay?false
205How to use TypeScript in create-react-app application?false
Miscellaneousfalse
206What are the main features of reselect library?false
207Give an example of reselect usage?false
209Does the statics object work with ES6 classes in React?false
210Can Redux only be used with React?false
211Do you need to have a particular build tool to use Redux?false
212How Redux Form initialValues get updated from state?false
213How React PropTypes allow different type for one prop?false
214Can I import an SVG file as react component?false
215Why are inline ref callbacks or functions not recommended?false
216What is render hijacking in React?false
217What are HOC factory implementations?false
218How to pass numbers to React component?false
219Do I need to keep all my state into Redux? Should I ever use react internal state?false
220What is the purpose of registerServiceWorker in React?false
221What is React memo function?false
222What is React lazy function?false
223How to prevent unnecessary updates using setState?false
224How do you render Array, Strings and Numbers in React 16 Version?false
225How to use class field declarations syntax in React classes?false
226What are hooks?false
227What are the rules needs to follow for hooks?false
228How to ensure hooks followed the rules in your project?false
229What are the differences between Flux and Redux?false
230What are the benefits of React Router V4?false
231Can you describe about componentDidCatch lifecycle method signature?false
232In which scenarios error boundaries do not catch errors?false
233Why do you not need error boundaries for event handlers?false
234What is the difference between try catch block and error boundaries?false
235What is the behavior of uncaught errors in react 16?false
236What is the proper placement for error boundaries?false
237What is the benefit of component stack trace from error boundary?false
238What is the required method to be defined for a class component?false
239What are the possible return types of render method?false
240What is the main purpose of constructor?false
241Is it mandatory to define constructor for React component?false
242What are default props?false
243Why should not call setState in componentWillUnmount?false
244What is the purpose of getDerivedStateFromError?false
245What is the methods order when component re-rendered?false
246What are the methods invoked during error handling?false
247What is the purpose of displayName class property?false
248What is the browser support for react applications?false
249What is the purpose of unmountComponentAtNode method?false
250What is code-splitting?false
251What is the benefit of strict mode?false
252What are Keyed Fragments?false
253Does React support all HTML attributes?false
254What are the limitations with HOCs?false
255How to debug forwardRefs in DevTools?false
256When component props defaults to true?false
257What is NextJS and major features of it?false
258How do you pass an event handler to a component?false
259Is it good to use arrow functions in render methods?false
260How to prevent a function from being called multiple times?false
261How JSX prevents Injection Attacks?false
262How do you update rendered elements?false
263How do you say that props are read only?false
264How do you say that state updates are merged?false
265How do you pass arguments to an event handler?false
266How to prevent component from rendering?false
267What are the conditions to safely use the index as a key?false
268Is it keys should be globally unique?false
269What is the popular choice for form handling?false
270What are the advantages of formik over redux form library?false
271Why do you not required to use inheritance?false
272Can I use web components in react application?false
273What is dynamic import?false
274What are loadable components?false
275What is suspense component?false
276What is route based code splitting?false
277Give an example on How to use context?false
278What is the purpose of default value in context?false
279How do you use contextType?false
280What is a consumer?false
281How do you solve performance corner cases while using context?false
282What is the purpose of forward ref in HOCs?false
283Is it ref argument available for all functions or class components?false
284Why do you need additional care for component libraries while using forward refs?false
285How to create react class components without ES6?false
286Is it possible to use react without JSX?false
287What is diffing algorithm?false
288What are the rules covered by diffing algorithm?false
289When do you need to use refs?false
290Is it prop must be named as render for render props?false
291What are the problems of using render props with pure components?false
292How do you create HOC using render props?false
293What is windowing technique?false
294How do you print falsy values in JSX?false
295What is the typical use case of portals?false
296How do you set default value for uncontrolled component?false
297What is your favorite React stack?false
298What is the difference between Real DOM and Virtual DOM?false
299How to add Bootstrap to a react application?false
300Can you list down top websites or applications using react as front end framework?false
301Is it recommended to use CSS In JS technique in React?false
302Do I need to rewrite all my class components with hooks?false
303How to fetch data with React Hooks?false
304Is Hooks cover all use cases for classes?false
305What is the stable release for hooks support?false
306Why do we use array destructuring (square brackets notation) in useState?false
307What are the sources used for introducing hooks?false
308How do you access imperative API of web components?false
309What is formik?false
310What are typical middleware choices for handling asynchronous calls in Redux?false
311Do browsers understand JSX code?false
312Describe about data flow in react?false
313What is react scripts?false
314What are the features of create react app?false
315What is the purpose of renderToNodeStream method?false
316What is MobX?false
317What are the differences between Redux and MobX?false
318Should I learn ES6 before learning ReactJS?false
319What is Concurrent Rendering?false
320What is the difference between async mode and concurrent mode?false
321Can I use javascript urls in react16.9?false
322What is the purpose of eslint plugin for hooks?false
323What is the difference between Imperative and Declarative in React?false
324What are the benefits of using typescript with reactjs?false
325How do you make sure that user remains authenticated on page refresh while using Context API State Management?false
326What are the benefits of new JSX transform?false
327How does new JSX transform different from old transform?false
328How do you get redux scaffolding using create-react-app?false
329What are React Server components?false