diff --git a/files/en-us/learn_web_development/core/frameworks_libraries/react_getting_started/index.md b/files/en-us/learn_web_development/core/frameworks_libraries/react_getting_started/index.md
index f39eb7b6474e2d8..8a85fefbaaa567d 100644
--- a/files/en-us/learn_web_development/core/frameworks_libraries/react_getting_started/index.md
+++ b/files/en-us/learn_web_development/core/frameworks_libraries/react_getting_started/index.md
@@ -320,25 +320,25 @@ This export statement makes our `App()` function available to other modules. We'
Let's open `src/main.jsx`, because that's where the `` component is being used. This file is the entry point for our app, and it initially looks like this:
```jsx
-import React from "react";
-import ReactDOM from "react-dom/client";
-import App from "./App.jsx";
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
import "./index.css";
+import App from "./App.jsx";
-ReactDOM.createRoot(document.getElementById("root")).render(
-
+createRoot(document.getElementById("root")).render(
+
- ,
+ ,
);
```
-As with `App.jsx`, the file starts by importing all the JS modules and other assets it needs to run.
+As with `App.jsx`, the file starts by importing all the JavaScript modules and other assets it needs to run.
-The first two statements import the `React` and `ReactDOM` libraries because they are referenced later in the file. We don't write a path or extension when importing these libraries because they are not local files. In fact, they are listed as dependencies in our `package.json` file. Be careful of this distinction as you work through this lesson!
+The first two statements import `StrictMode` and `createRoot` from the `react` and `react-dom` libraries because they are referenced later in the file. We don't write a path or extension when importing these libraries because they are not local files. In fact, they are listed as dependencies in our `package.json` file. Be careful of this distinction as you work through this lesson!
We then import our `App()` function and `index.css`, which holds global styles that are applied to our whole app.
-We then call the `ReactDOM.createRoot()` function, which defines the root node of our application. This takes as an argument the DOM element inside which we want our React app to be rendered. In this case, that's the DOM element with an ID of `root`. Finally, we chain the `render()` method onto the `createRoot()` call, passing it the JSX expression that we want to render inside our root. By writing `` as this JSX expression, we're telling React to call the `App()` _function_ which renders the `App` _component_ inside the root node.
+We then call the `createRoot()` function, which defines the root node of our application. This takes as an argument the DOM element inside which we want our React app to be rendered. In this case, that's the DOM element with an ID of `root`. Finally, we chain the `render()` method onto the `createRoot()` call, passing it the JSX expression that we want to render inside our root. By writing `` as this JSX expression, we're telling React to call the `App()` _function_, which renders the `App` _component_ inside the root node.
> **Note:** `` is rendered inside a special `` component. This component helps developers catch potential problems in their code.
@@ -395,7 +395,7 @@ Some attributes are different than their HTML counterparts. For example, the `cl
### JavaScript expressions as content
-Unlike HTML, JSX allows us to write variables and other JavaScript expressions right alongside our other content. Let's declare a variable called `subject` just above the `App()` function:
+Unlike HTML, JSX allows us to write variables and other JavaScript expressions right alongside our other content. Let's declare a variable called `subject` just above the `App()` function in your `App.jsx` file:
```jsx
const subject = "React";