How to convert inline babel script to JS

I am new to React JS and written some React JS code directly to HTML and it is working fine.

Now when I converted this inline code to JS using babel converter using Online Babel Converter and link the Converted JS to HTML, it is showng the blank the UI with no error or warning on browser console window.

I've written the inline babel script in <script type="text/babel> ... </script> tag

Note: I converted the inline code with default selected options in Online Babel Converter, Evaluate in Settings, stage-2 & react in Presets

Edit: Added some portion of code

<!DOCTYPE HTML>
<html>
    <body>
        <script type="text/babel>
            class App extends React.Component {
                createCircles = () => {
                let circles = [];
            
                for(let i = 1; i <= this.props.count; i++){
                    circles.push(<div className = "smallCircle" id={'circle'+i} key={i}><code className="circles" id={'id'+i}>{i}</code></div>);
                }
                                
                return circles;
            }
                        
                render(){
                    return (
                        <div id="circles">
                            <div className = "bigCircle" id="bigCircle">
                                <img id="bigCircleImage" src="http://localhost" />
                            </div>
                            <div className = "smallCircles">
                                {this.createCircles()}
                            </div>
                        </div>
                    );
                 }
            }
            
            function AppLoader(){
                return (
                    <App />
                );
            }
                        
            ReactDOM.render(<AppLoader />, document.getElementById('root'));
        </script>
        <div id="root"></div>
    </body>
</html>

Solution

Agreed with @JoeWarner answer to not to use extra AppLoader function if you are not returning more than one component.

Coming to the question, I saw that you written the script before the div tag of id root. After converting your script, import the script below the tag to see the changes