What's the difference between React elements and React components?

Beginner

Answer

React Element: A plain JavaScript object that describes what should appear on screen. It's the smallest building block of React apps.

const element = <h1>Hello, World!</h1>;

React Component: A function or class that returns React elements. Components are reusable and can accept inputs (props).

// Function component
function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

// Class component
class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}