CPCODELAB
React

What is React and Why Components?

8 min read

What is React?

React is a JavaScript library for building user interfaces. Created by Meta, it powers millions of web apps by letting you describe your UI as a tree of components — small, reusable pieces of code that each own their markup, logic, and style.

Unlike traditional DOM manipulation, React maintains a virtual DOM — a lightweight copy of the real DOM. When state changes, React diffs the virtual tree and applies only the minimal set of real DOM updates, making updates fast and predictable.

Why components?

Components let you split a complex page into isolated, testable units. A <Button> built once can be reused everywhere. Each component encapsulates its own logic, so bugs are easy to locate and fixes propagate automatically across every usage.

jsx
// The simplest possible React component
function Greeting() {
  return <h1>Hello, world!</h1>;
}

export default Greeting;

React components must start with a capital letter. Lowercase tags like <div> are treated as native HTML elements; capitalized ones like <Greeting> are treated as components.

Ready to test yourself?
Practice React— quiz & coding exercises