Create-react-app - how does index.html read React application code?

Viewed 5215

I'm new to React and I used this explanation to build a basic React app: https://facebook.github.io/react/docs/installation.html

I opened a new project by:

npm install -g create-react-app
create-react-app my-app

cd my-app
npm start

index.html file is located in hello-world/public and here is the content of it:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="theme-color" content="#000000">
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
    <title>React App</title>
  </head>
  <body>
    <noscript>
      You need to enable JavaScript to run this app.
    </noscript>
    <div id="root">

    </div>
  </body>
</html>

However, all the "React stuff" is placed in hello-world\src directory. It looks that 'hello-world\src\index.js' activates the components.

What I don't understand is how index.html "reads" the content of index.js. index.html has no html tag that leads to index.js.

I can start this application by doing "npm start". What this command does is raising a server running on localhost:3000. How can I see the application without using "npm start"?

2 Answers
Related