URL: http://imgh.us/react-lifecycle.svg

I don't know who made this flowchart originally, but whoever you are: Thank you!

At this point, in my React learning I think I've memorized much of this but it's taken me a lot of time and having to dig up the documentation again. (Also, not to mention the number of times I've typo'ed componentWillReciveProps and componentWillRecevieProps etc.)

Remember this; You don't need to know all of these by heart to be good at React. In fact, there's several of these that I almost never use.

React lifecycle hooks flowchart

UPDATE

The above link is dead. Use this blog post instead.

UPDATE April 2018

Here's an even better one from @dan_abramov:

React life-cycle hooks

Comments

Rodrigo García

Yeah! Dan Abramov's schema is way better and cristal clear! Thank you.

Your email will never ever be published.

Previous:
Fastest *local* cache backend possible for Django August 4, 2017 Python, Web development, Django
Next:
Fastest way to match a filename's extension in Python August 31, 2017 Python
Related by category:
How to SSG a Vite SPA April 26, 2025 JavaScript, React
Switching from Next.js to Vite + wouter July 28, 2023 JavaScript, React
An ideal pattern to combine React Router with TanStack Query November 18, 2024 JavaScript, React
get in JavaScript is the same as property in Python February 13, 2025 JavaScript
Related by keyword:
4 different kinds of React component styles April 7, 2016 React, JavaScript
Component, component function or plain function in React February 6, 2018 React