Question 1

What are React synthetic events?

Accepted Answer

**Target Audience:** Engineers preparing for React interviews — no prior knowledge of the event system assumed. **Difficulty:** Easy > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term:. Everything about the event object below was **executed against React 19.2.8** and the raw output is pasted in section 3. For the delivery mechanism — where the listener actually lives — see

Question 2

What are React Hooks? Name a few common ones.

Accepted Answer

**Target Audience:** Anyone preparing for a React interview — assumes components and props. **Difficulty:** Easy > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term:. The hook inventory in section 4 was read directly off the installed React 19.2.8 rather than recalled, which matters because several were added recently. ## 1. Why This Even Matters — A Story First Imagine a workshop where only the master craftsmen were allo

Question 3

What is `PropTypes` and when would you use it?

Accepted Answer

**Target Audience:** Engineers preparing for React interviews — assumes basic component knowledge. **Difficulty:** Easy > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term:. This topic has a genuine breaking change behind it, so the central claim below was verified by actually rendering a component with propTypes on React 19.2.8 and by checking the React upgrade guide — not recalled. ## 1. Why This Even Matter

Question 4

createContext vs use(Context) — new context consumption in React 19

Accepted Answer

# `createContext` vs. `use(Context)`: New Context Consumption in React 19

**Target Audience:** Frontend engineers preparing for React interviews — assumes basic familiarity with Context and Hooks.
**Difficulty:** Medium

> **How to read this doc:** Every concept is explained in plain language first. Right after, you'll see a callout like `📌 Interview term:` — that's the exact vocabulary a senior engineer would use for the same idea.

## 1. Why This Even Matters — A Story First

Think of Contex

Question 5

How do you handle side effects in functional components?

Accepted Answer

**Target Audience:** Frontend engineers preparing for React interviews — assumes basic familiarity with Hooks. **Difficulty:** Medium > **How to read this doc:** Every concept is explained in plain language first, then tagged with 📌 Interview term: — the exact vocabulary an interviewer expects. Every ordering and lifecycle claim below was produced by actually running React 19.2.8 in a real DOM (jsdom) in this repo, not described from documentation. ## 1. Why This Even Matters — A

Question 6

What is the role of `react-dom`?

Accepted Answer

**Target Audience:** Frontend engineers preparing for React interviews — assumes basic familiarity with components. **Difficulty:** Easy to Medium > **How to read this doc:** Every concept is explained in plain language first. Right after, you will see a callout like 📌 Interview term: — that is the exact vocabulary a senior engineer would use for the same idea. Every package-export and behavioural claim below was produced by actually running React 19.2.8 in this repo, not describe

Question 7

What are React Developer Tools and how do you use them?

Accepted Answer

**Target Audience:** Engineers preparing for React interviews — assumes you have built a React app. **Difficulty:** Easy > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term:. The React 19 API surface referenced in section 6 was read off the installed React 19.2.8 in this repo. ## 1. Why This Even Matters — A Story First The browser Elements panel shows you the finished building: walls, doors, paint. What it cannot show yo

Question 8

What is the purpose of the `key` prop when rendering lists in React?

Accepted Answer

**Target Audience:** Engineers preparing for React interviews — assumes rendering lists. **Difficulty:** Easy to Medium > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term:. The mismatch in section 3 was produced by typing into a real input and then reordering the list on React 19.2.8. ## 1. Why This Even Matters — A Story First A cloakroom numbers its hooks rather than its coats. Hook 1, hook 2, hook 3. It works perfectl

Question 9

Explain the concept of 'lifting state up' in React.

Accepted Answer

**Target Audience:** Engineers preparing for React interviews — assumes props and state. **Difficulty:** Easy > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term:. This is the focused technique; passing data between components surveys all the mechanisms, and unidi

Question 10

What are the advantages of using React over plain JavaScript?

Accepted Answer

**Target Audience:** Engineers preparing for React interviews — assumes JavaScript and DOM basics. **Difficulty:** Easy to Medium > **How to read this doc:** Concepts are explained in plain language first, then tagged with 📌 Interview term:. This is a trade-off question, so the answer below deliberately includes the costs — an interviewer is often testing whether you can argue against your own tool. ## 1. Why This Even Matters — A Story First Picture a whiteboard tracking a foot

REACT.JSDECODED.

Transmission log

What are React synthetic events?

What are React Hooks? Name a few common ones.

What is `PropTypes` and when would you use it?

createContext vs use(Context) — new context consumption in React 19

How do you handle side effects in functional components?

What is the role of `react-dom`?

What are React Developer Tools and how do you use them?

What is the purpose of the `key` prop when rendering lists in React?

Explain the concept of 'lifting state up' in React.

What are the advantages of using React over plain JavaScript?

How do you pass data between components in React?

Explain the concept of 'unidirectional data flow' in React.

What is JSX?

What is the difference between element and component in React?

forwardRef removal — how do refs work as props in React 19?

What are fragments in React?

What is the Virtual DOM in React?

What is React and its main features?

How do you debug React applications?

What is the purpose of `React.StrictMode`?

How do you manage component-level state without `useState` or `useReducer`?

What is the difference between state and props?

What are React Components?

What is the role of a bundler like Webpack in a React project?

What is `create-react-app` and when would you use it?

What is the purpose of the cleanup function in useEffect?

What are React's design principles?

What is the difference between `useState` and `useReducer`?

What is the purpose of the `deps` array in `useEffect` and `useCallback`?

Describe the `useRef` hook and its typical use cases.

How does React handle security concerns like XSS?

The `use()` API with Suspense — how do you unwrap promises in render?

useOptimistic — how do you build instant UI for Server Actions?

useTransition vs startTransition — when to use which?

How would you structure a large React application?

What are render props and how do they work?

Explain the concept of reconciliation in React.

Describe the React component lifecycle.

Explain the concept of 'composition' in React components.

How does React handle events?

How do you handle asynchronous operations in React functional components?

What is the Context API in React and when would you use it?

How does React's Batching work?

How do you test React components?

RSC vs Client Components — when do you add 'use client' in Next.js 15?

What are React custom hooks and when should you use them?

How do you fetch data in React?

What is the difference between controlled and uncontrolled components?

What is the difference between useMemo and useCallback?

How do you handle routing in React applications?

How do you handle memory leaks in React?

How do you prevent unnecessary re-renders in functional components?

How do you handle forms in React?

When would you choose a class component over a functional component with hooks?

How do you interact with external APIs in React?

What is 'prop drilling' and how can it be avoided?

How do you manage global state in a large React application?

React 19 ref as prop & ref cleanup — the new cleanup return from ref callbacks

Describe the benefits of using TypeScript with React.

What are Higher-Order Components (HOCs) in React?

Explain the purpose of `useEffect`.

useFormStatus & useActionState — modern form handling in React 19

Async Server Components & waterfall prevention — fetching without blocking

What are Error Boundaries in React?

How do you optimize performance in a React application?

Server Actions — how do mutations work without API routes in Next.js 15?

Next.js instrumentation hook — observability in Next.js 15

What is `React.memo` and when would you use it?

Error Boundaries with RSC — why can't Server Components catch errors?

Explain React Suspense and its use cases.

What is the difference between shadow DOM and virtual DOM?

What causes stale closures in React hooks, and how do you fix them correctly?

What are Actions in React 19, and how do they change form handling?

What is `useFormStatus` in React 19, and why does it exist?

What are Effect Events (`useEffectEvent`) and what problem do they solve?

What does the `useActionState` hook do in React 19?

What problem does `useSyncExternalStore` solve?

How do you optimize React component rendering?