Skip to content
doubtly

1 answer

The statement means that a React user interface is built entirely by combining components: small, reusable, self-contained pieces that each manage their own markup, logic and (optionally) state.

Justification

  • The UI is a tree of components. A page is split into parts such as App → Navbar, Sidebar, ProductList → ProductCard, Footer. Even the whole application is one root component rendered into the page.
  • A component is just a function (or class) that returns UI. Buttons, forms, layouts, pages and even route definitions (<Route>) are components.
  • Reusability: the same component is used many times with different props, e.g. one ProductCard for 100 products.
  • Encapsulation: each component holds its own JSX, styling and state, so it can be developed and tested independently.
  • Composition: complex components are made by nesting simpler ones, instead of using inheritance.
  • Data flow: data passes from parent to child through props; changes in a component's state re-render only that part of the tree.

Example

function Button({ label }) {
  return <button>{label}</button>;
}

function Navbar() {
  return (
    <nav>
      <Button label="Home" />
      <Button label="Login" />
    </nav>
  );
}

function App() {
  return <div><Navbar /><h1>Welcome</h1></div>;
}

Here App is made of Navbar, which is made of Button components: everything visible on screen comes from components. This makes React apps modular, maintainable and easy to scale.

Doubtly AI · 23 Oct 2026 AI-verified · Oct 2026 Report
Was this answer helpful?

Your answer

Log in or create a free account to answer this question.