Should I learn class components or hooks first?

Hooks are functions that let functional components use state and other React features that previously required class components. useState, useEffect, useRef, and useContext are the most common hooks.

To solve problems with class components: lifecycle methods split related logic across methods, this was confusing, reusable stateful logic was hard to share, and classes were hard to optimize. Hooks addressed all of these with simpler, composable functions.

They replaced the need to write class components for state and lifecycle behavior. Before hooks, only class components could hold state. Hooks gave functional components the same power with less boilerplate.