Introduction to React

React is a JavaScript library for building user interfaces. Unlike PHP or Python, it isn't a general-purpose language — it's a tool that runs on top of the JavaScript you already know, specifically for building the interactive parts of a webpage.

In the JavaScript DOM lesson, you learned to update a page by directly finding elements and changing them — document.querySelector(...).textContent = .... That works fine for a small change, but as an interface grows — a shopping cart, a live comment feed, a dashboard — manually tracking every element that needs to update, and exactly when, becomes genuinely hard to keep correct.

React takes a different approach: you describe what the interface should look like for a given set of data, and React figures out how to update the actual page to match, whenever that data changes. You stop writing step-by-step DOM instructions and start writing a description of the end result — this shift is usually called moving from imperative to declarative UI code.

A React interface is built from components — small, self-contained, reusable pieces, each responsible for one part of the page. A product card, a navigation bar, a comment, a button — each becomes its own component, built once and reused wherever it's needed, each with its own data plugged in.

React was built at Facebook and open-sourced in 2013, and has since become one of the most widely used tools for building web interfaces — which matters practically the same way PHP's popularity does: React skills transfer directly to a huge number of real jobs and existing codebases, and the same core ideas carry over into React Native for building mobile apps.

The next lesson gets a real React project running on your machine, so every example from here on is something you can try yourself.