Back to Tech Interviews
React.js Interview Questions & Answers
Comprehensive collection of 200+ ReactJS interview questions and answers. Master React 18 & 19, Fiber Architecture, Hooks, Concurrent Mode, and State Management.
Total: 200 QuestionsLearned: 0 / 200 (0%)
Difficulty Filters
Tools & Options
Showing 200 of 200 questions
Beginner
What is React?
React is a JavaScript library for building user interfaces, primarily for single-page applications. It's used for handling the view layer for web and mobile apps.
Beginner
What is JSX?
JSX stands for JavaScript XML. It allows us to write HTML elements in JavaScript and place them in the DOM without any createElement() or appendChild() methods.
Beginner
What are the core features of React?
Core features include Virtual DOM, JSX, Components, One-way data binding, and Simplicity (easy to learn and use).
Beginner
What is the Virtual DOM?
Beginner
What are Components in React?
Beginner
Difference between Functional and Class Components?
Beginner
What are Props?
Beginner
What is State?
Beginner
What is the use of 'key' prop in lists?
Beginner
What is useState hook?
Beginner
What is useEffect hook?
Beginner
Explain One-way Data Binding.
Beginner
What is a Single Page Application (SPA)?
Beginner
How do you handle events in React?
Beginner
What is Conditional Rendering?
Beginner
What is a React Fragment?
Beginner
What is 'create-react-app'?
Beginner
How do you add styles in React?
Beginner
What is the 'children' prop?
Beginner
What is the significance of 'className'?
Beginner
What are Hook rules?
Beginner
Difference between React and Angular?
Beginner
What is an event pooling?
Beginner
How to pass data from child to parent?
Beginner
What is the default port for React local server?
Beginner
What is the purpose of 'export default'?
Beginner
How to update state based on previous state?
Beginner
What is a Pure Component?
Beginner
What is the use of 'npm' in React?
Beginner
What is 'strict mode' in React?
Beginner
What is ReactDOM?
Beginner
How to comment in JSX?
Beginner
What are Synthetic Events?
Beginner
What is a Controlled Input?
Beginner
What is an Uncontrolled Input?
Beginner
What is the difference between HTML and React events?
Beginner
What is Babel?
Beginner
What is Webpack?
Beginner
How to prevent a component from rendering?
Beginner
What is 'prop-types'?
Beginner
Difference between UI and Logic?
Beginner
What is a higher-order component (basic)?
Beginner
What is the role of 'package.json'?
Beginner
How to handle forms in React?
Beginner
What is an Array Map in React?
Beginner
What is 'destructuring' in React?
Beginner
What is React.memo()?
Beginner
Importance of 'useEffect' dependency array?
Beginner
How to navigate between pages (basic)?
Beginner
What is the 'public' folder for?
Experience
Explain the Context API in detail.
Experience
When to use useMemo vs useCallback?
Experience
How do you optimize React performance?
Experience
What are React Portals?
Experience
Explain Error Boundaries.
Experience
How to handle global state without Redux?
Experience
What is useReducer hook?
Experience
Explain 'lifting state up'.
Experience
What are custom hooks?
Experience
Difference between useMemo and React.memo?
Experience
Explain forwardRef.
Experience
What is useRef and its common use cases?
Experience
Explain React Router v6 features.
Experience
How to fetch data in useEffect properly?
Experience
What is the use of Layout components?
Experience
How to implement Protected Routes?
Experience
Difference between server-side and client-side routing?
Experience
How to use the useContext hook?
Experience
What is 'Prop Drilling' and how to avoid it?
Experience
Explain the concept of 'Render Props'.
Experience
What is the difference between useLayoutEffect and useEffect?
Experience
How to optimize images in React?
Experience
What is Dependency Injection in React?
Experience
Explain React's 'Reconciliation'.
Experience
How to debug React applications?
Experience
What is the 'key' warning in console?
Experience
How to handle large forms in React?
Experience
What is the Virtual DOM's 'Diffing' algorithm?
Experience
Explain state persistence (localStorage) in React.
Experience
What are Higher-Order Components (HOC) examples?
Experience
How to handle API errors globally?
Experience
Difference between Shadow DOM and Virtual DOM?
Experience
What is React.lazy and Suspense?
Experience
What are fragments shorthand issues?
Experience
How to use useImperativeHandle?
Experience
What is the importance of 'cleanup function' in useEffect?
Experience
How to fetch data derived from multiple state changes?
Experience
Explain component composition vs inheritance.
Experience
What is the 'batching' of updates?
Experience
How to test components thoroughly?
Experience
What is 'shallow rendering' in tests?
Experience
How to handle accessibility (A11y) in React?
Experience
What is 'Hydration' in React?
Experience
How to manage theme (Dark/Light) in React?
Experience
What is the use of 'debugger;' statement?
Experience
How to fix 'Maximum update depth exceeded' error?
Experience
Explain the 'module' pattern in React project structure.
Experience
How to use 'URL Search Params' in React?
Experience
What is React's Concurrent Mode?
Experience
How to use SVGs effectively in React?
Advanced
What is the React Fiber architecture?
Advanced
Explain SSR, SSG, and ISR in Next.js.
Advanced
How do you implement Micro-frontends with React?
Advanced
Explain the 'useTransition' hook.
Advanced
What is the 'useDeferredValue' hook?
Advanced
How to handle memory leaks in large applications?
Advanced
Deep dive: Reconciliation and Diffing logic.
Advanced
Redux Saga vs Redux Thunk.
Advanced
Explain Server Components in React 18.
Advanced
What is 'Atomic State Management' (Recoil/Jotai)?
Advanced
How to implement Custom Middleware in Redux?
Advanced
Web Workers integration with React.
Advanced
Security best practices: XSS and Data Sanitization.
Advanced
Explain the 'Double Invoke' in StrictMode.
Advanced
What is 'Zustand' and why is it popular?
Advanced
Optimizing Web Vitals in a React app.
Advanced
Explain 'Code Splitting' beyond React.lazy.
Advanced
How does the 'useSyncExternalStore' hook work?
Advanced
Using 'useId' for unique identifiers.
Advanced
Explain 'Automatic Batching' in React 18.
Advanced
What is 'Tree Shaking'?
Advanced
Implementing complex animations (e.g., Framer Motion).
Advanced
Testing Hooks with renderHook.
Advanced
How to handle 'Hydration Mismatch'?
Advanced
Explain 'Streaming SSR'.
Advanced
What are 'Ref' utility patterns (e.g., Callback Refs)?
Advanced
Architecture: Feature-Slicing Design (FSD).
Advanced
How to implement Multi-language (i18n) at scale?
Advanced
Security: JWT storage (Cookie vs LocalStorage).
Advanced
Explain 'Module Federation' in depth.
Advanced
Performance: Virtualization (react-window).
Advanced
What is 'useInsertionEffect'?
Advanced
How to build a Design System with React?
Advanced
Handling Cross-tab Communication.
Advanced
Explain 'Command Pattern' in React.
Advanced
What is 'Preact' and when to use it?
Advanced
What is 'TanStack Query' (React Query)?
Advanced
Explain 'Finite State Machines' with XState.
Advanced
Advanced usage of useReducer with Middleware.
Advanced
How to scale React applications for millions of users?
Advanced
What are 'React Native' differences?
Advanced
Explain 'Reflecting' state to URL.
Advanced
How to optimize Context API re-renders?
Advanced
What is 'Experimental React' branch?
Advanced
Handling File Uploads at scale.
Advanced
What is 'Isomorphic JavaScript'?
Advanced
Explain 'Duck Pattern' in Redux.
Advanced
Using 'Proxy' for state management.
Advanced
What is 'Shadowing' in Gatsby/Next.js?
Advanced
Future of React: What's after React 18/19?
Experience
How to implement a useLocalStorage hook?
Beginner
Reverse a string in JavaScript without built-in 'reverse'?
Beginner
Implement a simple counter with useReducer.
Experience
How to debounce a function in React?
Beginner
Find the longest word in a sentence.
Beginner
Remove duplicates from an array.
Advanced
Implement a deep clone function.
Beginner
Check if a string is a palindrome.
Advanced
Convert a nested object to a flat URL query string.
Experience
Flatten a nested array.
Beginner
Count character occurrences in a string.
Experience
Group an array of objects by a property.
Beginner
Implement a basic Fetch with error handling.
Beginner
Create a simple Toggle hook.
Beginner
Find the intersection of two arrays.
Beginner
Sum of all numbers in an array.
Experience
Implement a 'usePrevious' hook.
Advanced
How to throttle a function?
Beginner
Check if two arrays are equal.
Experience
Merge two sorted arrays efficiently.
Beginner
Implement Fibonacci sequence (recursive).
Beginner
FizzBuzz implementation in JS.
Beginner
Detecting Prime numbers.
Beginner
Capitalize the first letter of each word.
Experience
Find the missing number in an array (1 to N).
Advanced
How to handle infinite scrolling?
Beginner
Creating a controlled vs uncontrolled component (Code).
Experience
Using 'useMemo' for expensive sorting.
Beginner
Generating a random color in JS.
Experience
Implementing a Countdown Timer.
Beginner
Finding duplicate numbers in an array.
Experience
How to use 'useCallback' to prevent unnecessary child renders?
Beginner
Convert snake_case to camelCase.
Advanced
Implement a simple Pub/Sub pattern.
Beginner
Extract numeric values from a string.
Beginner
Calculating Factorial (Iterative).
Beginner
Using 'useId' for accessible labels (Code).
Advanced
How to prevent memory leaks with AbortController?
Experience
Find the second largest number in an array.
Beginner
Implementing a 'useWindowSize' hook.
Advanced
Deep merge two objects.
Experience
Fetch multiple URLs concurrently.
Beginner
Shuffle an array randomly.
Beginner
Removing specific value from array.
Experience
Implement a 'useUpdateEffect' hook.
Beginner
Checking for empty object.
Beginner
Calculating average of array numbers.
Experience
Generating UUID v4 in JS.
Beginner
Creating a custom context provider wrapper.
Beginner
Handling Form Data easily with JavaScript.
Technical Interview Mastery Blueprint
Proven methodologies and frameworks to succeed in technical and architecture rounds.
1. The Engineering STAR Technique
When responding to architectural or situational questions, structure your answer using Situation, Technical Constraint, Action, and Measurable Result. Rather than jumping straight to syntax, articulate the business problem, why certain patterns (e.g. caching, queuing, immutability) were selected over alternatives, and what latency or throughput improvements were achieved.
2. Defending Architectural Trade-Offs
Senior interviewers evaluate how you weigh trade-offs. Always explain why you chose an approach: e.g., memory overhead vs CPU cycle speed, consistency vs availability (CAP theorem), or normalized schemas vs denormalized fast reads. Stating the drawbacks of your own proposal demonstrates maturity and production experience.
3. Clean Code & Edge-Case Proactivity
In live-coding rounds, communicate your thinking aloud before typing. State edge cases explicitly: null or undefined inputs, extreme boundary values, concurrency races, and network timeouts. Writing modular, well-named functions with deterministic unit tests separates junior candidates from staff-level engineers.
4. Antipatterns to Avoid
Avoid reciting memorized definitions without practical context. Never dismiss non-functional requirements such as security (CSRF, injection, token rotation), observability (logging, metrics), and accessibility (ARIA, semantic standards). Always ask clarifying scope questions before writing complex implementations.
Continuous learning: Practice daily, mark completed questions as learned, and revisit difficult concepts.Explore All Interview Tracks →
Explore Related Tools
Hand-picked utilities and calculators related to this tool.
