react vs react DOM confusion

Question

I\'m using ES6 babel with react, and now for the newer version react, react DOM is not a part of it anymore. My doubt for below code is that, is it the first line require? s

Answer 1

From the docs of ReactDOM:

This package serves as the entry point of the DOM-related rendering paths. It is intended to be paired with the isomorphic React, which will be shipped as react to npm.

So your ReactDOM is specifically for DOM related paths for rendering. This used to come tightly coupled with the React package itself, but the built in DOM in React has become deprecated.

Now, Facebook ships the ReactDOM separately as its own package, so yes, you need to include it in your app if you're planning on rendering any of your React. And you also definitely need React itself — ReactDOM is just the DOM side.

---

Here's a reddit post that explains the separation from React and ReactDOM.

The React team are working on extracting all DOM-related stuff into a separate library called ReactDOM. 0.14 is the first release in which the libraries are split.

Little fun fact, since they want to support backwards compatibility, they kept React's internal DOM but deter people from using it in a funny way.

Answer 2

They are separated from version 0.14 and for any react project, you need to include both, ReactDOM is laying on React, and React, without ReactDOM could not be rendered to the DOM, so the Answer is a big Yes!

Answer 3

React has the need to separate core react code that has nothing to do with generating a web application (HTML DOM). Particularly react-native, there are a different set of packages that are required for React Native and react-dom is not one of them.

If the react library had never split up that DOM related code, a react-native project would have core react code that would be dead weight and then need to be removed using tree shaking and dead code elimination to remove modules in which you have never imported as part of your app.

Having react split this code up makes a lot of sense.

Answer 4

React from version 0.14 onwards is split into two parts: React and ReactDOM. You are making use of ReactDOM to render you HTML element. So it definitely makes sense for you to import ReactDOM in your Component. But as far as React is concerned although you are not making use of React directly but it is indirectly being used because whatever you write in your return statement will be transpiled into React.createElement function that will create the actual DOM elements.

Now you can see this if you omit React in your code, you will see an error that

react is not present

and it will give you that React is not recognised in React.createElement. Hope you understood it.