Element Not rendering (React, Django)

Hi everyone, I just started learning React and Django and I have been struggling with a bug for days: I can’t render anything on my website using react.

Here is my App.js:

import React, { Component } from "react";
import { render } from "react-dom";

export default class App extends Component {
  render() {
return (
  <h1> Testing React </h1> 

render(<App />, document.getElementById("app"));

My index.js:
import App from './components/App.js';

and my index.html:

<!DOCTYPE html>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Music Controller</title>
{% load static %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="{% static "css/index.css" %}"
<div id="main">
  <div id="app"></div>
  {% load static%}
<script src="{% static "frontend/main.js" %}"></script>

PS : It’s not throwing any errors when running ‘npm run dev’ and ‘python .\manage.py runserver’ .