Components Deep Dive

Functional Components

Modern React components are plain functions returning JSX. Names use PascalCase.

function Welcome({ name }) {
  return <h1>Hello, {name}!</h1>;
}

Composition over Inheritance

Build complex UIs from small components and pass content via children and props.

Lifting State Up

When siblings need shared data, move state to their common parent and pass it down.

Key Points

• Components are self-contained UI modules.
• Prefer composition to inheritance.
• Prefer custom hooks to HOCs for reuse.