Mounting phase in React - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the mounting phase in React?

The mounting phase is when a React component is created and inserted into the DOM for the first time.

beginner

Which React hook is commonly used to run code during the mounting phase?

The useEffect hook with an empty dependency array ([]) runs code only once after the component mounts.

intermediate

What happens if you pass an empty array [] as the second argument to useEffect?

The effect runs only once after the component mounts, similar to the mounting phase behavior.

beginner

Name one common task performed during the mounting phase.

Fetching data from a server or setting up subscriptions are common tasks done during the mounting phase.

beginner

True or False: The mounting phase happens every time a component updates.

False. The mounting phase happens only once when the component is first added to the DOM, not on updates.

When does the mounting phase occur in React?

A When the component is first added to the DOM

B Every time the component updates

C When the component is removed from the DOM

D When the component re-renders

The mounting phase happens only once when the component is first inserted into the DOM.

Which hook is best to run code only once after a component mounts?

A useState

B useReducer

C useContext

D useEffect with []

Using useEffect with an empty dependency array runs the effect only once after mounting.

What is a common use case during the mounting phase?

A Updating state on user input

B Fetching initial data

C Cleaning up event listeners

D Re-rendering the component

Fetching initial data is often done once when the component mounts.

What happens if you omit the dependency array in useEffect?

A Effect never runs

B Effect runs only once after mounting

C Effect runs after every render

D Effect runs only on unmount

Without dependencies, useEffect runs after every render, not just mounting.

True or False: The mounting phase includes cleaning up resources.

A False

B True

C Only sometimes

D Depends on the component

Cleaning up happens during the unmounting phase, not mounting.

Explain the mounting phase in React and how you can run code during this phase.

Think about when the component appears on the screen for the first time.

Describe a practical example of something you might do during the mounting phase.

What do you need to do once when a component starts?