Web Development
React.js Questions Comprehensive collection of the most frequently asked React JS interview questions covering fundamentals, hooks, routing, testing, and advanced concepts. Each answer is concise and interview-ready.
1. What is React, and what are its main features? Beginner 2. What is JSX and how does it work? Beginner 3. Explain the concept of the Virtual DOM in React. Intermediate 4. How does virtual DOM in React work? What are its benefits and downsides? Intermediate 5. What is the difference between React Node, React Element, and React Component? Intermediate 6. What are React Fragments used for? Beginner 7. What is the purpose of the key prop in React? Intermediate 8. What is the consequence of using array indices as keys in React? Intermediate 9. What are props in React? How are they different from state? Beginner 10. What is the difference between React's class components and functional components? Beginner 11. When should you use a class component over a function component? Intermediate 12. What is React Fiber? Advanced 13. What is reconciliation? Intermediate 14. What is the difference between Shadow DOM and Virtual DOM? Advanced 15. What is the difference between Controlled and Uncontrolled React components? Intermediate 16. How would you lift the state up in a React application, and why is it necessary? Intermediate 17. What are Pure Components? Intermediate 18. What is the difference between createElement and cloneElement? Intermediate 19. What is the role of PropTypes in React? Beginner 20. What are stateless components? Beginner 21. What are stateful components? Beginner 22. What are the recommended ways for type checking of React component props? Intermediate 23. Why does React recommend against mutating state? Intermediate 24. What are the benefits of using hooks in React? Intermediate 25. What are the rules of React hooks? Intermediate 26. What is the difference between useEffect and useLayoutEffect in React? Intermediate 27. What does the dependency array of useEffect affect? Intermediate 28. What is the useRef hook in React and when should it be used? Intermediate 29. What is the purpose of callback function argument format of setState() in React class components? Intermediate 30. What is the useCallback hook in React and when should it be used? Intermediate 31. What is the useMemo hook in React and when should it be used? Intermediate 32. What is the useReducer hook in React and when should it be used? Intermediate 33. What is the useId hook in React and when should it be used? Intermediate 34. Can you explain how to create and use custom hooks in React? Intermediate 35. What does re-rendering mean in React? Beginner 36. What is forwardRef() in React used for? Advanced 37. What are error boundaries in React for? Advanced 38. What is React Suspense? Advanced 39. Explain what React hydration is? Advanced 40. What are React Portals used for? Advanced 41. What is React strict mode and what are its benefits? Intermediate 42. What is code splitting in a React application? Intermediate 43. How would one optimize the performance of React contexts to reduce rerenders? Advanced 44. What is the Flux pattern? Advanced 45. Explain one-way data flow of React Beginner 46. What are some pitfalls of using context in React? Advanced 47. What are some React anti-patterns? Intermediate 48. How do you decide between using React state, context, and external state managers? Intermediate 49. Explain what happens when setState is called in React? Intermediate 50. Explain prop drilling Beginner 51. Describe lazy loading in React Intermediate 52. Discuss synthetic events in React Intermediate 53. Explain the React component lifecycle methods in class components. Intermediate 54. What is Concurrent Mode in React, and how does it improve rendering performance? Advanced 55. How does React handle concurrent rendering with multiple updates and prioritize them? Advanced 56. How would you handle long-running tasks or expensive computations in React applications without blocking the UI? Advanced 57. Explain server-side rendering of React applications and its benefits Advanced 58. Explain static generation of React applications Advanced 59. What are higher-order components in React? Advanced 60. Explain the presentational vs container component pattern in React Intermediate 61. What are render props in React? Advanced 62. Explain the composition pattern in React. Intermediate 63. How do you re-render the view when the browser is resized? Beginner 64. How do you handle asynchronous data loading in React applications? Intermediate 65. What are some common pitfalls when doing data fetching in React? Intermediate 66. What is a React Router? Intermediate 67. How does React Router work, and how do you implement dynamic routing? Intermediate 68. How do you handle nested routes and route parameters in React Router? Intermediate 69. What is the difference between BrowserRouter and HashRouter? Intermediate 70. How React Router is different from the history library? Advanced 71. What are the <Router> components of React Router v6? Intermediate 72. What is the purpose of the push and replace methods of history? Intermediate 73. How do you navigate programmatically in React Router? Intermediate 74. How would you implement route guards or private routes in React? Intermediate 75. How do you manage the active route state in a multi-page React application? Beginner 76. How do you handle 404 errors or page not found in React Router? Beginner 77. How to get query parameters in React Router? Beginner 78. How do you perform an automatic redirect after login in React Router? Intermediate 79. How do you pass props to a route component in React Router? Beginner 80. How do you localize React applications? Intermediate 81. What is react-intl? Intermediate 82. What are the main features of react-intl? Intermediate 83. What are the two ways of formatting in react-intl? Beginner 84. How to use FormattedMessage as a placeholder using react-intl? Beginner 85. How to access the current locale with React Intl? Beginner 86. How to format date using react-intl? Beginner 87. How do you test React applications? Intermediate 88. What is Jest and how is it used for testing React applications? Intermediate 89. What is React Testing Library and how is it used for testing React components? Intermediate 90. How do you test React components using React Testing Library? Intermediate 91. How do you test asynchronous code in React components? Intermediate 92. How do you mock API calls in React component tests? Intermediate 93. How do you test React hooks in functional components? Intermediate 94. How do you test custom hooks in React? Intermediate 95. What is Shallow Renderer in React testing? Intermediate 96. What is Snapshot Testing in React? Intermediate 97. How do you test React components that use context? Intermediate 98. How do you test React components that use Redux? Intermediate 99. What are the key differences between shallow rendering and full DOM rendering in React tests? Intermediate 100. What is the TestRenderer package in React? Intermediate