React JS Viva Questions & Answers

Disclaimer: These questions are just for your knowledge purpose. Do not asssume the same questions will be asked in your Viva Voce

Also go through the audio files & video files in Introduction section in React Intro!

React JS Introduction

Q1. What is React?
A JavaScript library for building user interfaces.
Q2. Who developed React?
Developed by Facebook (Meta).
Q3. What is JSX?
A syntax extension that allows writing HTML in JavaScript.
Q4. What is Virtual DOM?
A lightweight copy of real DOM used for faster updates.
Q5. What are components?
Reusable building blocks of a React application.
Q6. What are Hooks?
Functions that allow using state and lifecycle features in functional components.
Q7. What is useEffect?
A Hook used to perform side effects like API calls.
Q8. What is state?
An object that holds dynamic data in a component.
Q9. What are props?
Inputs passed from parent to child components.
Q10. Difference between state and props?
State is internal and mutable, props are external and read-only.
Q11. What is a Single Page Application (SPA)?
An application that loads a single HTML page and updates content dynamically.
Q12. What is React Router?
A library used for navigation between pages in React.
Q13. What is key in React?
A unique identifier for elements in a list.
Q14. What is event handling?
Handling user actions like clicks or input changes.
Q15. What is conditional rendering?
Displaying UI based on conditions.
Q16. Functional vs Class components?
Functional use hooks; class use lifecycle methods.
Q17. What is useRef?
A Hook used to access DOM elements directly.
Q18. What is useContext?
Used to share data globally without props drilling.
Q19. What is props drilling?
Passing data through multiple nested components.
Q20. Why is React fast?
Because of Virtual DOM and efficient updates.
Q21. What is React?
A: JS library for UI.
Q22. JSX?
A: HTML-like syntax in JS.
Q23. Virtual DOM?
A: Faster UI updates.
Q24. Hooks?
A: Functions for state & lifecycle.
Q25. useEffect?
A: For side effects.

Program 1: useState + Input

Q1. What is useState?
A: Hook to manage state in functional components.
Q2. Why use state?
A: To store dynamic data and re-render UI.
Q3. Controlled component?
A: Input controlled by React state.

Program 2: Props

Q1. What are props?
A: Data passed from parent to child.
Q2. Are props mutable?
A: No, they are read-only.
Q3. Props vs State?
A: Props = external, State = internal.

Program 3: Counter

Q1. What is state management?
A: Managing data using useState.
Q2. Prevent negative values?
A: Add condition (count > 0).
Q3. What is re-rendering?
A: UI updates when state changes.

Program 4: To-Do List

Q1. Why array in state?
A: To store multiple tasks.
Q2. Delete task?
A: Using filter method.
Q3. What is key?
A: Unique identifier for list items.

Program 5: Component Composition

Q1. What is composition?
A: Combining components.
Q2. Why child components?
A: Reusability.

Program 6: Form Validation

Q1. What is validation?
A: Checking inputs before submit.
Q2. Validate email?
A: Using regex.
Q3. Prevent default?
A: Avoid page reload.

Program 7: ProfileCard

Q1. Styling methods?
A: Inline, external CSS.
Q2. Circular image?
A: border-radius: 50%.

Program 8: Reminder App

Q1. What is filtering?
A: Display specific data.
Q2. Conditional rendering?
A: Render UI based on condition.

Program 9: React Router

Q1. What is React Router?
A: Navigation library.
Q2. What is Route?
A: Path-component mapping.
Q3. What is Link?
A: Navigation without reload.

Program 10: Lifecycle + API

Q1. Lifecycle methods?
A: Methods in component life.
Q2. componentDidMount?
A: Runs after render.
Q3. componentDidUpdate?
A: Runs on update.