So i'd like to handle element clicks but in a external js file. (my js file is in the public folder)

 import React, { Component } from 'react';
 import './App.css'; 
import './App.css';

function App() {
    return (
<div className="App">
   <button id="testbtn">asd</button>
</div>
    );
}
export default App;

This is my App.js code (this file is in the src/ folder) In the public folder there is my main.js file which has been imported in index.html (import was successful console.log works fine)

document.getElementById("testbtn").onclick = function () {
  console.log("asd");
};

I aslo got an error:

Uncaught TypeError: Cannot set properties of null (setting 'onclick')