Now that we understand the folder structure, let's understand how React is initialized.

package.json contains important dependencies for React. When we run npm start, React is downloaded into node_modules and made available to the project. The following is an extract from package.json:

"dependencies": {
 "react": "^16.8.6",
 "react-dom": "^16.8.6",
 "react-scripts": "3.0.0"
 },

In the previous snippet, react refers to the core React library and react-dom to the library used to render React applications in a DOM-based browser.

public/index.html defines a root element with the root ID:

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

In src/index.js, we use ReactDOM to display the App component in the root element:

ReactDOM.render(<App />, document.getElementById('root'));

Let's update the App component in App.js to display something simpler:

function App() {
  return (<h1>Todo Application</h1>);
}

When you save this, you see that the browser refreshes automatically and shows the following screenshot: