What React is
React is a JavaScript library for building user interfaces. Its core move is simple: describe the interface as a tree of components. A component receives data through props, keeps local state when needed, and returns markup. When data changes, React recomputes the relevant UI and updates the screen.
The facebook/react repository was created on GitHub in May 2013, around the time React was open sourced by Facebook. Unlike a full application framework, React has traditionally stayed focused on the UI layer: it provides the component model and runtime, while routing, data fetching, styling, forms, and build stack are chosen by the application or a framework on top.
That boundary is part of its popularity. A team can use React for a widget on an older page, an SPA, server rendering through Next.js, or native interfaces through React Native. React does not try to be the whole application, but a huge ecosystem grew around it.
Minimal stateful component
This example shows the everyday React shape: useState stores local state, an event changes it, and JSX describes the rendered output.
import { useState } from "react";
export function Counter() {
const [count, setCount] = useState(0);
return (
<button onClick={() => setCount(count + 1)}>
Clicked {count} times
</button>
);
}How React is used in practice
In a real product, React usually handles screen composition: small components become forms, tables, cards, modals, editors, dashboards, and complex interactive states. Data flows down through props, local state lives near interaction logic, and shared data moves into parent components, context, state managers, or server/cache libraries.
React is strong because it gives a predictable way to think. A component can be read as UI as a function of data: here is the input, here is the state, here is what should be on the screen. It does not remove application complexity, but it makes much of it explicit.
Lists and keys
Keys help React understand which list items stayed, were inserted, or changed between renders.
function TodoList({ todos }) {
return (
<ul>
{todos.map(todo => (
<li key={todo.id}>{todo.title}</li>
))}
</ul>
);
}Why React is popular
React landed in a useful compromise between a small core and a large ecosystem. It can be adopted gradually, and there are many libraries, developers, docs, UI kits, testing tools, and production frameworks around it. For companies, that lowers risk: hiring is easier, answers are easier to find, and long-running product work is easier to staff.
Another reason is portability of the mental model. Even when the stack changes, component thinking, props, state, composition, and declarative rendering remain useful. React influenced JavaScript, UI framework design, and what frontend developers expect from tools.
Limits
React does not solve the whole application by itself. Serious products still need routing, server rendering, data loading, cache invalidation, forms, permissions, analytics, accessibility, performance budgets, and deployment. The real choice is often not “React or not”, but “which React stack”: Next.js, Remix/React Router, Vite SPA, React Native, or an internal platform.
JSX and the closeness of markup to logic are also not for everyone. For small components it is convenient, but large files can become heavy quickly. React gives good primitives, but architectural discipline remains the team’s job.