Is React a Framework or Library?

Who decides how your application is organized: you, or the tool you build it with? The answer separates a library from a framework. It is also the reason React is called a library, even though many developers describe it as a framework.

A library is a collection of ready-made code for a specific set of tasks. Your program calls it when it needs that task done. You decide where and how it fits into your application.

A framework works the other way around. It defines the overall structure of the application, such as where files go, how pages are loaded and how data reaches them. You fill in the parts it asks for.

What React Covers

React is responsible for one part of an application: the user interface, sometimes called the view layer. It gives you a way to describe the interface as components, keeps track of the values that change while the page is in use, and updates the browser page when those values change. React's own website describes it as "the library for web and native user interfaces".

React does not decide the rest of the structure. It does not include a router for moving between pages. It also has no standard way to load data from a server, no folder layout and no build setup. For each of these, you either choose another library or write the code yourself.

For example, an application that needs several pages usually adds React Router, a separate library that this course covers in the Routing chapter.

React does include tools for managing a component's changing data, called state, through features such as useState and useReducer. Larger applications sometimes add a separate library, such as Redux, when many distant parts of the page share the same data, but React does not require one.

The Cost of Flexibility

This flexibility has a cost. Because React leaves these decisions open, every team has to make them. As a result, two React projects can look very different. A framework makes these decisions once, and every project that uses it follows the same conventions.

To make these decisions for you, several frameworks are built on top of React. Next.js and React Router in its framework mode add routing, data loading and server rendering around React, and the React documentation recommends starting a new application with one of them. When you use such a framework, React remains the library that draws the interface, and the framework supplies the structure around it.