React.
js Viva Questions and Answers
1. What is React.js?
Answer: React.js is a JavaScript library developed by Facebook for building user interfaces,
especially single-page applications.
2. What are the main features of React?
Answer: JSX, Virtual DOM, Component-based architecture, One-way data binding, and
performance optimizations.
3. What is the virtual DOM, and how does it work?
Answer: The virtual DOM is a lightweight copy of the real DOM. React updates the virtual DOM
first, compares it with the previous version, and efficiently updates only the changed parts in the real
DOM.
4. What is JSX?
Answer: JSX stands for JavaScript XML. It allows writing HTML elements in JavaScript and
placing them in the DOM without using functions like createElement().
5. What are components in React?
Answer: Components are the building blocks of a React application. They split the UI into
independent, reusable pieces.
6. Difference between functional and class components?
Answer: Functional components are stateless and use hooks. Class components are ES6 classes
with lifecycle methods and a render function.
7. What is the use of useState hook?
Answer: useState allows functional components to have state. It returns a stateful value and a
function to update it.
8. What does useEffect do?
Answer: useEffect is used to perform side effects in functional components, such as data fetching,
subscriptions, or manually changing the DOM.
9. How do you pass data from a parent to a child component?
Answer: Data is passed using props. The parent component sends data as attributes to the child
component.
10. What is the role of props in React?
Answer: Props are used to pass data and event handlers to components. They are read-only and
help make components reusable.
11. What is the difference between state and props?
Answer: State is managed within the component, while props are passed to the component. State
is mutable; props are immutable.
12. What is prop drilling, and how can you avoid it?
Answer: Prop drilling is passing props through multiple levels. It can be avoided using Context API
or state management libraries.
13. What are controlled and uncontrolled components?
Answer: Controlled components have form data controlled by React state. Uncontrolled
components store data in the DOM.
14. Explain React lifecycle methods (in class components).
Answer: Key lifecycle methods include componentDidMount, componentDidUpdate, and
componentWillUnmount.
15. How is conditional rendering done in React?
Answer: Using JavaScript operators like if-else, ternary operator, or logical && to conditionally
render elements.
16. How does React handle form submission?
Answer: Using event handlers like onSubmit, along with controlled components to manage form
state.
17. How do you optimize a React app?
Answer: Using techniques like code-splitting, memoization, lazy loading, and avoiding
unnecessary re-renders.
18. What is code-splitting in React?
Answer: It is a technique to split code into smaller bundles, which can be loaded on demand,
improving performance.
19. What is Context API, and when would you use it?
Answer: The Context API is used for sharing state across components without prop drilling.
20. What are keys in React, and why are they important?
Answer: Keys help React identify which items have changed, are added, or are removed. They
should be unique and stable.
21. How did you prepare for the proctored examination?
Answer: By regularly following the course, completing assignments, and revising concepts with
hands-on coding.
22. What was the most challenging topic during the course?
Answer: Understanding the useEffect hook and managing side effects properly.
23. Can you describe a small project or task you did during the course?
Answer: I built a to-do list app with add, delete, and filter functionalities using functional
components and hooks.
24. What did you learn about yourself through this course?
Answer: That I enjoy building UI and learning through structured online content.
25. How do you plan to apply React.js in real-world projects?
Answer: I plan to use it in my frontend development projects and explore full-stack development
using React with backend APIs.
