First React example in a React book ain't working


(Eduard Tkv) #1

I’ve started reading a book on React with Bootstrap. Here is the first simplest Hello World example

First Hello World Example

I copied it letter for letter and it is not outputting Hello World, the page is blank. All js files are there, I checked them by clicking on them.

Should I ditch that book and read something else?


(Eduard Tkv) #2

I mean is the code correct? Is it supposed to work?


(Jakob Lind) #3

The code works for me when using React files from CDN. I replaced this:

<script type="text/javascript" src="js/react.min.js"></script> 
<script type="text/javascript" src="js/react-dom.min.js"></script> 

with this:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js"></script>

(Eduard Tkv) #4

@jakoblind Thanks. Still doesn’t work for me. Anywa, is this a recommended way of doing things?


(Jakob Lind) #5

It’s the recommended way to start learning yes. Here is a similar example on codepen:

It’s linked from the official getting started docs: https://facebook.github.io/react/docs/hello-world.html maybe that could be a good resource for learning also.


(Eduard Tkv) #6

Thank you. Yea I read the FB tutorial but they suggest using create-react-app and installing it with npm and also on Codepen I can’t find where I can see how react files were included there. So I started reading this book which starts with the very basics and I was stuck on the very first example. And I just found an HTML example there, which I skipped the first time.

https://facebook.github.io/react/downloads/single-file-example.html


(Eduard Tkv) #7

I think the problem was that the book suggests browser.min.js and FB example uses babel.min.js. Weird, now I’m confused about the difference between these two


(Eduard Tkv) #8

Thanks. I figured it out. It was just a version incompatibility. It works now with either babel.js or browser.js