React Expert
What is the difference between Element and Component?
Select the correct answer
An Element in React is a function that returns HTML, while a Component is a plain object describing what you want to appear in the DOM.
An Element in React is a class, while a Component is a function.
An Element in React is used for styling, while a Component is used for rendering.
An Element is a plain object describing what you want to appear in the DOM, while a Component can be a class or function that returns an element.
What is Incremental Static Regeneration (ISR) in React?
Select the correct answer
Incremental Static Regeneration (ISR) in React is a technique for managing state.
Incremental Static Regeneration (ISR) in React is used for rendering content in the browser.
Incremental Static Regeneration (ISR) in React is a way to fetch data from an API.
Incremental Static Regeneration (ISR) in React allows you to update static content after the site is built.
Exlplain hydration in React.
Select the correct answer
Hydration in React is the process of rendering components on the server.
Hydration in React is the process of fetching data from an API.
Hydration in React is the process of attaching event listeners to a server-rendered markup.
Hydration in React is the process of defining component styles.
What is Static Site Generation (SSG) in React?
Select the correct answer
Static Site Generation (SSG) in React means generating HTML at build time.
Static Site Generation (SSG) in React means generating HTML at runtime.
Static Site Generation (SSG) in React is a technique for managing state.
Static Site Generation (SSG) in React is a way to fetch data from an API.
What is Server-Side Rendering (SSR) in React?
Select the correct answer
Server-Side Rendering (SSR) in React is a way to fetch data from an API.
Server-Side Rendering (SSR) in React means rendering the content on the server and sending HTML to the client.
Server-Side Rendering (SSR) in React means rendering the content in the browser.
Server-Side Rendering (SSR) in React is a technique for managing state.
What is Client-Side Rendering (CSR) in React?
Select the correct answer
Client-Side Rendering (CSR) in React means rendering the content in the browser using JavaScript.
Client-Side Rendering (CSR) in React means rendering the content on the server.
Client-Side Rendering (CSR) in React is a way to fetch data from an API.
Client-Side Rendering (CSR) in React is a technique for managing state.
What is React.memo, and how can it be used to optimize functional components?
Select the correct answer
React.memo is used to define component styles.
React.memo is a method for managing component state.
React.memo is used to fetch data from an API.
React.memo is a higher order component used to optimize functional components by preventing unnecessary re-renders.
What is a Higher-Order Component (HOC) in React?
Select the correct answer
A Higher-Order Component (HOC) in React is a technique for styling components.
A Higher-Order Component (HOC) in React is a function that takes a component and returns a new component.
A Higher-Order Component (HOC) in React is a method for fetching data.
A Higher-Order Component (HOC) in React is a way to manage component state.
What is a React error boundary, and how can it be useful for handling errors in components?
Select the correct answer
A React error boundary is a way to define component styles.
A React error boundary is used to fetch data from an API.
A React error boundary is a method for managing component state.
A React error boundary is a component that catches JavaScript errors anywhere in their child component tree.
Why is it important to maintain immutability when updating state in React?
Select the correct answer
Maintaining immutability when updating state in React is important because it simplifies HTML markup.
Maintaining immutability when updating state in React is important because it allows direct manipulation of DOM elements.
Maintaining immutability when updating state in React is important because it enhances CSS performance.
Maintaining immutability when updating state in React is important because it helps ensure predictable state changes and simplifies debugging.
Why can hooks not be conditional in React?
Select the correct answer
Hooks cannot be conditional in React because they rely on a consistent order of execution.
Hooks cannot be conditional in React because they cannot be used inside loops.
Hooks cannot be conditional in React because they cannot access props.
Hooks cannot be conditional in React because they cannot handle asynchronous code.
What is the difference between controlled vs. uncontrolled components in React?
Select the correct answer
Controlled components in React can only be used in class components.
Controlled components in React have their state controlled by React, while uncontrolled components have their state controlled by the DOM.
Controlled components in React are used for handling side effects.
Uncontrolled components in React are used for managing global state.
What is a pure function in React?
Select the correct answer
A pure function in React is a function that returns the same output for the same input without side effects.
A pure function in React is a function that can mutate state directly.
A pure function in React is a function that makes API calls.
A pure function in React is a function that fetches data.
What are forward refs?
Select the correct answer
Forward refs in React are used to manage component state.
Forward refs in React are used to fetch data from an API.
Forward refs in React are used to handle side effects.
Forward refs in React are used to pass refs to child components.
What are the two primary ways of creating components in React?
Select the correct answer
The two primary ways of creating components in React are server components and client components.
The two primary ways of creating components in React are functional components and class components.
The two primary ways of creating components in React are CSS components and HTML components.
The two primary ways of creating components in React are state components and stateless components.
What are the purpose of keys in React lists?
Select the correct answer
Keys in React lists help identify which items have changed, are added, or removed.
Keys in React lists are used to create event handlers for the list items.
Keys in React lists are used to style the list items.
Keys in React lists are used to fetch data for the list items.
Can web browsers read JSX directly?
Select the correct answer
Web browsers can read JSX if it is included in a script tag.
No, web browsers cannot read JSX directly; it needs to be transpiled to JavaScript.
Only some web browsers can read JSX directly.
Yes, web browsers can read JSX directly without any transpilation.
What does reconciliation mean in React?
Select the correct answer
Reconciliation in React is the process of fetching data from APIs.
Reconciliation in React is the process of managing component states.
Reconciliation in React is the process of defining component styles.
Reconciliation in React is the process of updating the DOM to match the virtual DOM.
What are React Fragments?
Select the correct answer
React Fragments are a way to handle side effects in React.
React Fragments are a method for managing state in React.
React Fragments are used to define CSS styles in React.
React Fragments let you group multiple elements without adding extra nodes to the DOM.
What is the virtual DOM?
Select the correct answer
The virtual DOM is a lightweight copy of the actual DOM that React uses to optimize updates.
The virtual DOM is a tool for managing API requests.
The virtual DOM is a database for storing component states.
The virtual DOM is a CSS framework for styling components.
What is NextJS and major features of it?
Select the correct answer
NextJS is a testing library for React applications.
NextJS is a database management system for React applications.
NextJS is a CSS framework for styling React applications.
NextJS is a React framework for server-side rendering and static site generation.
What are lifecycle methods?
Select the correct answer
Lifecycle methods are used to fetch data in React components.
Lifecycle methods are used to define routes in React components.
Lifecycle methods are special methods in React components that are called at different stages of a component's life.
Lifecycle methods are used to style React components.
What does unmounted mean in React?
Select the correct answer
Unmounted in React means the component has been rendered to the DOM.
Unmounted in React means the component has been removed from the DOM.
Unmounted in React means the component is initialized but not rendered.
Unmounted in React means the component is ready to receive props.
What does mounted mean in React?
Select the correct answer
Mounted in React means the component has been rendered to the DOM.
Mounted in React means the component is initialized but not rendered.
Mounted in React means the component has been removed from the DOM.
Mounted in React means the component is ready to receive props.
What does lifting state up mean in React?
Select the correct answer
Lifting state up means moving state to the global scope.
Lifting state up means moving state to a child component.
Lifting state up means moving state to a common ancestor component.
Lifting state up means moving state to a sibling component.
Name tools that can be used to test React apps?
Select the correct answer
Tools like Jest, Enzyme, and React Testing Library can be used to test React apps.
Tools like MongoDB and PostgreSQL can be used to test React apps.
Tools like Webpack and Babel can be used to test React apps.
Tools like Redux and MobX can be used to test React apps.
What are synthetic events in React?
Select the correct answer
Synthetic events in React are a method for fetching data.
Synthetic events in React are a way to manage component state.
Synthetic events in React are cross-browser wrappers around native events.
Synthetic events in React are a way to define CSS styles.
How do you create an event in React?
Select the correct answer
You create an event in React by using the useState hook.
You create an event in React by defining an event handler function and attaching it to an element.
You create an event in React by defining CSS styles.
You create an event in React by writing HTML templates.
What is an event in React?
Select the correct answer
An event in React is a way to define component styles.
An event in React is a component lifecycle method.
An event in React is an object that represents a user action.
An event in React is a method for managing state.
What is React Router?
Select the correct answer
React Router is a library for routing in React applications.
React Router is a library for styling React components.
React Router is a library for managing state in React.
React Router is a library for handling side effects in React.
How can you implement routing in a React application?
Select the correct answer
You can implement routing in React using React Router.
You can implement routing in React using the useState hook.
You can implement routing in React using CSS styles.
You can implement routing in React using HTML templates.
How is React different to React Native?
Select the correct answer
React is for mobile applications, while React Native is for web applications.
React Native is a tool for creating CSS stylesheets.
React Native is used for server-side rendering.
React is for web applications, while React Native is for mobile applications.
Give an example of how to use the useRef hook.
Select the correct answer
The useRef hook is a way to handle side effects.
The useRef hook is used for state management.
The useRef hook can be used to access a DOM element directly.
The useRef hook is used for routing in React applications.
Explain the useRef hook.
Select the correct answer
The useRef hook returns a mutable ref object.
The useRef hook is used to manage component state.
The useRef hook is a way to handle side effects.
The useRef hook is used for data fetching.
Explain the useReducer hook.
Select the correct answer
The useReducer hook is used for managing complex state logic.
The useReducer hook is a way to handle side effects.
The useReducer hook is used for fetching data.
The useReducer hook is used for routing in React applications.
Explain the useCallback hook.
Select the correct answer
The useCallback hook returns a memoized callback.
The useCallback hook is used for component rendering.
The useCallback hook is used for handling side effects.
The useCallback hook is a way to manage props changes.
Explain the useMemo hook.
Select the correct answer
The useMemo hook is used to fetch data from an API.
The useMemo hook is a way to handle state changes.
The useMemo hook is used for side effects in React.
The useMemo hook returns a memoized value.
Explain the useContext hook.
Select the correct answer
The useContext hook is a method for fetching data.
The useContext hook allows you to subscribe to React context changes.
The useContext hook is used for managing component state.
The useContext hook is a way to handle side effects in React.
What are the differences between useEffect and useLayoutEffect hooks?
Select the correct answer
The useEffect hook manages props changes, while the useLayoutEffect hook manages state changes.
The useEffect hook is used for asynchronous operations, while the useLayoutEffect hook is for synchronous ones.
The useEffect hook is used for data fetching, while the useLayoutEffect hook is for event handling.
The useEffect hook runs after every render, while the useLayoutEffect hook runs synchronously after all DOM mutations.
Explain the useEffect hook.
Select the correct answer
The useEffect hook is used to manage component styles.
The useEffect hook is a way to create new elements in React.
The useEffect hook is a method for managing event handlers.
The useEffect hook allows you to perform side effects in functional components.
Explain the useState hook.
Select the correct answer
The useState hook allows you to add state to functional components.
The useState hook is used to create context in React.
The useState hook is a way to handle side effects in React.
The useState hook is a method for fetching data in React.
What are hooks?
Select the correct answer
Hooks are functions that let you use state and lifecycle features in functional components.
Hooks are a way to manage CSS styles in React.
Hooks are functions that handle HTTP requests in React.
Hooks are methods used for routing in React applications.
What is the children prop?
Select the correct answer
The children prop is used to handle events in React components.
The children prop allows components to pass nested elements.
The children prop is a method for managing component state.
The children prop is used to define default values for inputs.
What are props?
Select the correct answer
Props are inputs to a React component.
Props are methods used to fetch data in React.
Props are the local state of React components.
Props are events that can be triggered in React components.
What is JSX?
Select the correct answer
JSX is a syntax extension for JavaScript used in React.
JSX is a type of database used by React applications.
JSX is a format for writing CSS styles in React.
JSX is a module bundler for React applications.
What are components in React?
Select the correct answer
Components are reusable building blocks in a React application.
Components are functions that run on the server in React.
Components are external libraries integrated into React applications.
Components are special HTML elements used in React.
What is React?
Select the correct answer
React is a JavaScript library for building user interfaces.
React is a JavaScript framework for building mobile applications.
React is a styling library for creating CSS stylesheets.
React is a tool for managing databases in JavaScript.
How to facilitate real-time communication in React applications?
Select the correct answer
To facilitate real-time communication in React applications, you can use HTML5 forms.
To facilitate real-time communication in React applications, you can use WebSockets or libraries like Socket.io.
To facilitate real-time communication in React applications, you can use the useState hook.
To facilitate real-time communication in React applications, you can use CSS animations.
How to loop inside JSX?
Select the correct answer
You can loop inside JSX using the map() function.
You can loop inside JSX using the useState hook.
You can loop inside JSX using CSS styles.
You can loop inside JSX using HTML templates.
How can you make API requests in a React application?
Select the correct answer
You can make API requests in React using HTML templates.
You can make API requests in React using CSS styles.
You can make API requests in React using the useState hook.
You can make API requests in React using the fetch function or Axios.