# "Learning React" book Chapter 2, coding did not work

**URL:** <https://forum.kirupa.com/t/learning-react-book-chapter-2-coding-did-not-work/644667>\
**Category:** web dev\
**Created:** [October 23, 2020, 4:56pm UTC](https://forum.kirupa.com/t/learning-react-book-chapter-2-coding-did-not-work/644667 "2020-10-23T16:56:55Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![rampar](https://avatars.discourse-cdn.com/v4/letter/r/ac91a4/32.png) [@rampar](https://forum.kirupa.com/u/rampar)\
**Post date:** [October 23, 2020, 4:56pm UTC](https://forum.kirupa.com/t/learning-react-book-chapter-2-coding-did-not-work/644667/1 "2020-10-23T16:56:55Z")

</div>

Hello Kirupa,  
I am through this book, trying to learn REACT, as a beginner.  
THis code below did not work for me. It did not display any text when I loaded them on a webpage.

> ```
> <DOCTYPE html>
> <html>
> <head>
> <meta charset="utf-8">
> <title> React1</title>
> <script>src="https://unpkg.com/react@16/umd/react.development.js"</script>
> <script>src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"</script>
> <script>src="https://unpkg.com/babel-standalone@6.15.0/babel.min.js"</script>
> 
> <style>
> #container {
> padding: 50px;
> background-color: #EEE;
> 
> }
> #container h1 {
> font-size: 144px;
> font-family:sans-serif;
> color: #0080A9;
> }
> </style>
> 
> </head>
> <body>
> <div id="container"></div>
> <script type="text/babel">
> var destination = document.querySelector("#container");
> ReactDOM.render(React.createElement(
> "h1",
> null,
> "Batman"), destination);
> 
> </script>
> 
> </body>
> </html>
> 
> </DOCTYPE>
> 
> ```

I got some help [stackoverlow.com](http://stackoverlow.com) and found that the following code works.

> ```
> <DOCTYPE html>
> <html>
> <head>
> <meta charset="utf-8">
> <title> React1</title>
> <style>
> #container {
> padding: 50px;
> background-color: #EEE;
> 
> }
> #container h1 {
> font-size: 144px;
> font-family:sans-serif;
> color: #0080A9;
> }
> </style>
> </head>
> <body>
> <div id="container"></div>
> 
> <script src="https://unpkg.com/react@15/dist/react.min.js"></script>
> <script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script>
> <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>
> <script type="text/babel">
> var destination = document.querySelector("#container");
> ReactDOM.render(React.createElement(
> "h1",
> null,
> "Batman"), destination);
> </script>
> 
> </body>
> </html>
> 
> ```

Please provide some clarification on the working code.  
Thanks  
Ram

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 24, 2020, 6:24pm UTC](https://forum.kirupa.com/t/learning-react-book-chapter-2-coding-did-not-work/644667/2 "2020-10-24T18:24:04Z")

</div>

If you look at the script declaration in the first example, the `src` attribute should be inside the script tag. Right now, it is outside of it. That means the scripts can’t load. If you fix that, your first example will work 😀

---

<div class="post-metadata">

**Author:** ![rampar](https://avatars.discourse-cdn.com/v4/letter/r/ac91a4/32.png) [@rampar](https://forum.kirupa.com/u/rampar)\
**Post date:** [October 27, 2020, 4:19am UTC](https://forum.kirupa.com/t/learning-react-book-chapter-2-coding-did-not-work/644667/3 "2020-10-27T04:19:19Z")

</div>

Thanks. That helps!!
