React vs ReactDOM?

Question

I\'m a bit new to react. I see we have to import two things to get started, React and ReactDOM, can anyone explain the difference. I\'m reading thr

Answer 1

From the React v0.14 Beta release announcement.

As we look at packages like react-native, react-art, react-canvas, and react-three, it's become clear that the beauty and essence of React has nothing to do with browsers or the DOM.

To make this more clear and to make it easier to build more environments that React can render to, we're splitting the main react package into two: react and react-dom.

Fundamentally, the idea of React has nothing to do with browsers, they just happen to be one of many targets for rendering trees of components into. The ReactDOM package has allowed the developers to remove any non-essential code from the React package and move it into a more appropriate repository.

The react package contains React.createElement, React.createClass and React.Component, React.PropTypes, React.Children, and the other helpers related to elements and component classes. We think of these as the isomorphic or universal helpers that you need to build components.

The react-dom package contains ReactDOM.render, ReactDOM.unmountComponentAtNode, and ReactDOM.findDOMNode, and in react-dom/server we have server-side rendering support with ReactDOMServer.renderToString and ReactDOMServer.renderToStaticMarkup.

These two paragraphs explain where the core API methods from v0.13 ended up.

Answer 2

To be more concise, react is for the components and react-dom is for rendering the components in the DOM. 'react-dom' acts as a glue between components and DOM. You will be using render() method of the react-dom to render components in the DOM and that's all you have to know when you are starting off with it.

Answer 3

The react package holds the react source for components, state, props and all the code that is react.

The react-dom package as the name implies is the glue between React and the DOM. Often, you will only use it for one single thing: mounting your application to the index.html file with ReactDOM.render().

Why separate them?

The reason React and ReactDOM were split into two libraries was due to the arrival of React Native (A react platform for mobile development).