Ruffeng Ruffeng -4 years ago 172
React JSX Question

React is not working

I'm starting to develop my frist app with React. I'm using React,Bootstrap and Babel to do it in ES6. All of them directly from CDN repo.

My problem is that this is not working and I cannot figure out what is exactly. At the beginning is really simple.

<!DOCTYPE html>
<meta charset="utf-8">
<title>Basic Example with JSX and ES6 features</title>
<link rel="stylesheet" href="" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<h1>Basic Example with JSX and ES6 features</h1>
<div id="yeah" class="container">
<script src="/vendors/react.js"></script>
<script src="/vendors/react-dom.js"></script>
<script src=""></script>
<script src=""></script>
<script src="" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

<script type="text/babel">
class Header extends React.component{
return( <div> Trying React </div>);

<Header />, document.getElementById('hey')

Any idea? I'm getting crazy trying to work out.
Thanks in advance!!

Answer Source

Here's working example for you on my Fiddle:

You are missing hey container in your HTML. Either add that to your HTML or change target to yeah container where your React code will be injected.

Also as Mark Scabbiolo mentioned in comments, you have type in React.component which is supposed to be React.Component

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download