Lesson 1 - Introduction

1.3 - Understanding The Main Entry File

The index.js file is the entry point of your React application. Here’s a basic example of what it looks like:

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';

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

Let's describe some essential parts of this core file:

  • Imports: The file starts by importing necessary modules, such as React and ReactDOM. It also loads additional CSS files and other necessary components.

  • Rendering: The ReactDOM.render() method is used to render the React application into the DOM element with the id root (Found in public/index.html).

  • StrictMode: React.StrictMode is a tool that helps highlight potential problems in your application. It activates additional checks and warnings for its descendants.