React: JavaScript Library for Building Component-Based User Interfaces

What React Does and Who It Is For

React is a JavaScript library for building user interfaces. The README identifies three defining properties. First, it is declarative: developers describe what the UI should look like for each application state, and React handles updating and rendering only the components that need to change. Second, it is component-based: interfaces are built from encapsulated components that manage their own state, and complex UIs are assembled from these components. Third, it follows a learn-once, write-anywhere model: the same React knowledge applies to web UIs via react-dom and to mobile apps via React Native.

React is for web developers building interactive single-page applications, for mobile developers using React Native, and for teams that want a predictable, debuggable approach to UI state management. The component model also makes it a natural fit for design systems where UI elements are shared across applications.

How React Works: The Component Model and the Virtual DOM

React's core mechanism is the component tree and its reconciliation algorithm. When application state changes, React computes a new virtual representation of the UI, compares it to the previous one, and applies only the necessary changes to the actual DOM. This comparison process is called reconciliation.

Components are either function components (plain JavaScript functions that accept props and return JSX) or class components (a legacy approach still supported but no longer the recommended style). Function components use Hooks for state and side effects. The README's example shows a function component:

import { createRoot } from 'react-dom/client';

function HelloMessage({ name }) {
  return <div>Hello {name}</div>;
}

const root = createRoot(document.getElementById('container'));
root.render(<HelloMessage name="Taylor" />);

This renders "Hello Taylor" into a DOM container. JSX is the HTML-like syntax used to describe the component's output. The README notes that JSX is not required but makes code more readable. The `babel.config.js` in the repository configures Babel for JSX transformation.

Installing React and Adding It to a Project

React's installation depends on the project context. The README describes three paths. For a quick taste, the Quick Start page at react.dev/learn works without any local setup. For adding React to an existing project, the documentation at react.dev/learn/add-react-to-an-existing-project covers adding it incrementally. For a new project with a full toolchain, the React team recommends starting with a React framework rather than a bare React installation.

The npm packages are `react` (the core library) and `react-dom` (the web renderer). The repository's package.json shows the workspaces structure: the packages are in `packages/*`, and the repository uses Yarn for dependency management. The `.nvmrc` file pins the Node.js version used in development. The React compiler is in the `compiler/` directory, indicating that newer React versions include a compiler for automatic optimization.

JSX, State, and the Core APIs

JSX is a syntax extension that lets developers write HTML-like markup inside JavaScript. The Babel configuration in the repository handles its transformation at build time. A JSX element like `<div>Hello {name}</div>` compiles to a `React.createElement('div', null, 'Hello ', name)` call.

React's state management uses Hooks. `useState` holds local component state and returns the current value and a setter function. `useEffect` runs side effects after renders. `useContext` reads from React context, allowing state to be shared without passing props through every level of the component tree. `useRef` holds a mutable value that does not trigger re-renders. These Hooks are part of the public API documented at react.dev/reference/react.

The repository's package structure shows individual packages under `packages/`: `react`, `react-dom`, `react-reconciler`, `react-native-renderer`, `react-server`, and others. This separation makes the core library independent of the rendering target.

React 19 and the React Compiler

The most recent release is v19.3.0 from 2026-09-09. The v19 release line introduced significant changes covered in the documentation at react.dev. The `compiler/` directory in the repository contains the React Compiler, which analyzes component code and automatically applies memoization optimizations that developers previously had to add manually using `useMemo` and `useCallback`.

The repository also contains a `babel.config-react-compiler.js`, indicating that the compiler integrates into the Babel pipeline. The `CHANGELOG.md` at the root documents changes across versions. The repository's `.nvmrc` and Yarn workspace setup reflect the development environment requirements for contributors who work on React itself.

React Native, Server Rendering, and the Ecosystem

The README states that React can render on the server using Node.js and power mobile apps using React Native. The `react-native-renderer` package in `packages/` is the rendering layer for React Native. The `react-server` package handles server-side rendering concerns.

The ecosystem around React is extensive. React Router handles client-side navigation. React Query and SWR handle data fetching and caching. Next.js and Remix are full-stack React frameworks that add server-side rendering, file-based routing, and deployment primitives on top of React. The React team's own recommendation for new projects is to start with one of these frameworks rather than React alone, as documented in the react.dev "Start a New React Project" page.

For state management beyond component state, libraries like Redux Toolkit, Zustand, and Jotai are common choices. React itself does not prescribe a state management approach beyond the built-in hooks.

Limitations and Cases Where React Is Not the Right Tool

React is a rendering library, not a full application framework. Routing, data fetching, form management, server communication, and deployment are all outside its scope and require additional libraries or a framework built on top of React.

The component model has a learning curve. Understanding the Hook rules (such as not calling Hooks inside conditions), the effect cleanup pattern, and the dependency array for `useEffect` takes time. The React documentation's own section on "Escape Hatches" covers cases where the mental model breaks down and direct DOM access or external system integration is needed.

React's reconciliation means that unnecessary re-renders are a common performance concern. The React Compiler in v19 addresses some of this automatically, but pre-v19 code requires manual memoization with `useMemo` and `useCallback` in performance-sensitive components.

For primarily content-driven websites with minimal interactivity, a full React setup adds unnecessary complexity. Static site generators that do not require a JavaScript framework may be more appropriate for those cases.

Comparing React to Vue and Angular

Vue is a JavaScript framework that combines a template syntax (closer to HTML) with a reactivity system and a component model. Vue ships more built-in features than React (a transition system, built-in directives) while React delegates those to the ecosystem. Vue's single-file components keep template, script, and style in one file, which some developers find more organized than React's JSX-in-JavaScript approach.

Angular is a full application framework from Google. It includes a router, HTTP client, forms module, and dependency injection out of the box. Angular uses TypeScript by default and follows a more opinionated, structured approach than React. React requires assembling an application from libraries. Angular's built-in scope makes it faster to reach a working application with standard features, but harder to replace parts that do not fit a project's needs.

All three are component-based. React is a library; Vue is a progressive framework; Angular is a full framework. The choice depends on team familiarity, the value placed on ecosystem flexibility versus built-in features, and whether the target is web, mobile, or both.

Maintenance, Licence, and Contributing

The repository is not archived. The last push was on 2026-09-27. The most recent release is v19.3.0 from 2026-09-09, and the project is under active development. React is maintained by engineers at Meta alongside open source contributors. The repository's MAINTAINERS file lists the active maintainers. The CONTRIBUTING.md and Code of Conduct are linked from the README.

React is MIT licensed, which is permissive and compatible with commercial and proprietary use. The `packages/` directory is split by package, and each package has its own versioning within the monorepo managed by Yarn workspaces. The `CHANGELOG.md` documents changes per version. The `.git-blame-ignore-revs` file at the root lists large formatting commits so that `git blame` skips them and shows meaningful authorship history.

Editorial conclusion

React is the practical first choice for JavaScript developers building interactive web UIs who want a component model with a large ecosystem, strong TypeScript support, and options ranging from client-side apps to server-side rendering through frameworks like Next.js. It is not a full framework, and projects that need routing, data fetching, and server rendering benefit from starting with a React framework rather than bare React. Before starting, decide whether a React framework or a client-only setup fits the project, and confirm the Node.js version requirements against the `.nvmrc` in the repository.

Frequently asked questions

Official sources

1. Official documentation
2. Official README
3. Project repository
4. Release notes