A flowchart that explains the new lifecycle of a Hooks component

by React

hook-flow

React Hooks were introduced in version 16.8.0. They are a complete departure from class component lifecycle events. For more information, see the official React Hooks API Reference.

Here is a flow diagram that explains the new flow of a Hooks component.

View demo Download Source

Flow Diagram

This flow diagram is also available as a PDF file.

Open in browser

To quickly open the Hook Flow Diagram in your default browser, you can execute the following
from your terminal. Commit this to memory! ?

$ npx hook-flow

GitHub