What is React (and Why It Exists)

Understand the problem React solves: keeping a complex UI in sync with changing data, without hand-writing DOM updates.

Step 1 of 3

The problem: keeping the screen in sync with your data

You already know how to change a page with JavaScript: grab an element with document.querySelector, then update its textContent or innerHTML. That works fine for one button or one counter.

But think about a screen like the YouTube homepage, the Instagram feed, or a Twitch chat. Hundreds of pieces of information change every second — like counts, new comments, who is online. If you tried to keep all of that correct by hand, you would write thousands of tiny "find this element, change that text" instructions, and a single missed update means the screen shows a lie.

This is the hard problem of building user interfaces: the screen must always match the current data. React was created at Facebook in 2013 for exactly this reason — their UI had grown too complex to keep in sync by hand.

Think of it this way: Imagine a restaurant where the kitchen's order screen has to match every change a customer makes. The old way is a waiter running back and forth erasing and rewriting each line by hand — easy to get wrong. React is like a system where you just hand over the final order, and a manager figures out exactly which lines on the screen need to change.

Learn more on MDN

React.dev — Quick Start