react-dom
React DOM is the package that provides DOM-specific methods for React, serving as the entry point to the DOM and server renderers. While the react package conta…
Installation
npm install react-dom
yarn add react-dom
pnpm add react-dom
Import
import { createRoot } from 'react-dom/client';Quick Example
import { createRoot } from 'react-dom/client';
import App from './App';
const root = createRoot(
document.getElementById('root')
);
root.render(<App />);About react-dom
React DOM is the package that provides DOM-specific methods for React, serving as the entry point to the DOM and server renderers. While the react package contains the core library for defining components and managing state, react-dom handles the actual rendering of those components to the browser DOM or to HTML strings for server-side rendering. The package exports the createRoot function for mounting React applications to a DOM container element, hydrateRoot for hydrating server-rendered HTML, and various utilities for portals and event handling. React DOM also includes the server rendering APIs through react-dom/server, providing renderToString, renderToStaticMarkup, and the streaming renderToPipeableStream and renderToReadableStream methods for Node.js and web streams respectively. This separation between react and react-dom was introduced in React 0.14 to enable React Native and other renderers to share the core react package. React DOM handles browser-specific concerns like event delegation, attribute mapping, and DOM element creation while React handles component logic and reconciliation.
Quick Facts
| Package | react-dom |
| Category | Framework |
| Weekly Downloads | 24M+ |
| License | MIT |
| Install | npm install react-dom |
Related Packages
React is the most popular JavaScript library for building user interfaces, developed and maintained …
Next.js is the leading React framework for building full-stack web applications, developed and maint…
Preact is a fast 3kB alternative to React with the same modern API. It provides the thinnest possibl…
Gatsby is a React-based static site generator and framework that leverages GraphQL for data manageme…
Remix is a full-stack web framework built on web standards that focuses on server-side rendering, pr…
Browse npm Packages by Category
Explore our reference of 200 popular npm packages with install commands, examples, and quick-start guides.