⚛️React setup : index.js

connecting the HTML with JavaScript

Now, we will connect the foundational HTML file with a foundational JavaScript file; this src/index.js file also happens to import the React scripts:

// reactjon/src/index.js

/* dependencies */
import { StrictMode } from "react"
import { createRoot } from "react-dom/client"
import App from "./App"

/* manipulation of the index.html DOM */
const rootElement = document.getElementById("root")
const root = createRoot(rootElement)

/* displaying the React virtual DOM */
root.render(
  <StrictMode>
    <App />
  </StrictMode>
)

Note that errors will occur because we have not created the App code yet, which will do in the next section!

Also note:

• StrictMode is a built-in component of React which outputs errors in the browser's console concerning any problems inside the <StrictMode></StrictMode> tag

• createRoot builds upon the DOM in index.html