Key Concepts

Review core concepts you need to learn to master this subject

Component Mount

A React component mounts when it renders to the DOM for the first time. If it’s already mounted, a component can be rendered again if it needs to change its appearance or content.

Component Lifecycle Methods
Lesson 1 of 1
  1. 1
    We’ve seen that React components can be highly dynamic. They get created, rendered, added to the DOM, updated, and removed. All of these steps are part of a component’s lifecycle. The component …
  2. 2
    React components have several methods, called lifecycle methods, that are called at different parts of a component’s lifecycle. This is how you, the programmer, deal with the lifecycle of a compo…
  3. 3
    We’ve made a clock component, but it’s static. Wouldn’t it be nice if it updated? At a high level, we’d like to update this.state.date with a new date once per second. JavaScript has a helpful fu…
  4. 4
    Our clock is working, but it has an important problem. We never told the interval to stop, so it’ll keep running that function forever (or at least, until the user leaves/refreshes the page). When…
  5. 5
    Remember the three parts of a component’s lifecycle: 1. Mounting, when the component is being initialized and put into the DOM for the first time 2. Updating, when the component updates as a r…
  6. 6
    We’ve come to the end of the lesson. We’ve learned about the three major phases of a component’s lifecycle: 1. Mounting, when the component is being initialized and put into the DOM for the firs…

What you'll create

Portfolio projects that showcase your new skills

Pro Logo

How you'll master it

Stress-test your knowledge with quizzes that help commit syntax to memory

Pro Logo