So you heard about javascript fatigue and using webpack makes you feel like programming may not be your thing after all?

Well, what if I told you you can use React and ES6 and JSX in a normal index.html file with no npm or webpack in sight? Yeah, I couldn’t believe it too, but adding React should be no harder than adding jQuery.

So, without further ado, let’s start with a normal index.html containing nothing more than:

<p>Hello world</p>

So far so good. Now that we have a starting page, how would one go about adding a reference to an external library? Well, using CDN is a reasonable start when experimenting with a new library. Let’s remove the p added above and replace it with the following:

<div id="root"></div>

<script src="

<script src=" https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js</a> "> https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js</a> "> https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js</a> "> <script type="text/babel">

class Greeting extends React.Component {

render() {

return (<p>Hello world</p>);

}

} ReactDOM.render(

<Greeting />,

document.getElementById('root')

);

</script>

Refresh the page! Nothing changed, right?

Except that you got React, ES6 and JSX by adding nothing more than a couple of external library references and then writing inline js code.