Linking React File

Importing "react.min.js" using a script tag will mean the "React" object is a global variable.
Importing "react-dom.min.js" using a script tag will mean the "ReactDOM" object is a global variable.
Notice that the script reference to "index.js" is at the bottom of the body.
The JavaScript code does not contain any JSX.


index.html

<!DOCTYPE html> 
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
</head>

<body>
<div id="app"></div>
<script src="index.js" type="text/javascript"></script>
</body>
</html>

index.js

var App = React.createClass({ 
  displayName: 'App',
  render: function() {
    // The second parameter is an object of attributes for the element (if any)
    return React.createElement('div', { }, 'Hello World');
  }
});
 
ReactDOM.render(
  React.createElement(App),
  document.getElementById('app')
);


© 2019 Better Solutions Limited. All Rights Reserved. © 2019 Better Solutions Limited TopPrevNext