1. What describes JSX?

❌ An add-on for JavaScript
❌ An error object
✅ JavaScript XML, a syntax extension for JavaScript
❌ A JavaScript library

Explanation:
JSX allows you to write HTML-like syntax inside JavaScript.

---

2. Tool that quickly sets up a new React project with modern features?

❌ CRA
❌ Webpack
❌ Babel
✅ Vite

Explanation:
Vite is the modern fast-build tool with fast refresh, HMR, and instant startup.

---

3. What is “one-way binding” in React?

✅ Data flows only from parent → child
❌ Data flows child → parent
❌ Data flows both ways
❌ No data flow

Explanation:
React uses unidirectional data flow through props.

---

4. What role does the Virtual DOM play?

❌ Provides each component its own DOM
❌ Lets React directly change the DOM
✅ Updates only the parts of the DOM that need to change
❌ Replaces browser’s DOM

Explanation:
React compares a virtual copy to the real DOM and updates efficiently.

---

5. How does React send data from one class component to another?

❌ Global variables
❌ Outside files
❌ Hooks
✅ Props

Explanation:
Props are the standard way to pass data between components.

---

6. Which method does React invoke along with componentDidMount() when mounting a class component?

❌ getDerivedStateFromProps()
❌ componentWillUnmount()
❌ componentWillMount()
❌ componentDidUpdate()

Correct Answer:
➡️ componentWillMount() (legacy)

But React no longer recommends or uses componentWillMount(), yet this is the only mounting lifecycle method besides componentDidMount() among the options.

So the quiz intends:
✅ componentWillMount() (legacy mounting method)

---

7. Which method updates state when props change?

✅ getDerivedStateFromProps()
❌ getSnapshotBeforeUpdate()
❌ componentDidUpdate()
❌ render()

Explanation:
getDerivedStateFromProps() is called when props update and can modify state.

---

8. What happens when state changes in a class component?

❌ Nothing changes
✅ The component re-renders
❌ Props update automatically
❌ State change is ignored

Explanation:
State updates trigger a re-render of the component tree.

---

9. What syntax style does React use to update the UI?

❌ Imperative
✅ Declarative
❌ JSX
❌ HTML

Explanation:
React describes what the UI should look like—not how to update it.

---

10. Which option shows correct JSX syntax?

Option 1 is valid JSX:
✅

❌ Option 2 — missing return
❌ Option 3 — invalid without a fragment wrapper for multiple elements
❌ Option 4 — missing return

---

🧾 SUMMARY TABLE

---