<!DOCTYPE html> 
<html>
     <body> 
        <div id="root"></div> 
    </body> 
    <script src="<https://unpkg.com/[email protected]/umd/react.production.min.js>"> </script> 
    <script src="<https://unpkg.com/[email protected]/umd/react-dom.production.min.js>">  </script> 
    <script src="<https://unpkg.com/@babel/standalone/babel.min.js>"></script> 
    <script type="text/babel"> 
    const root=document.getElementById("root"); 
    function Title() {
        return(
            <h3 id="title" onMouseEnter={() => console.log("마우스가 감지되었습니다")}>
            웹스터디 실습 
            </h3>
        );
        }
    const Button= () =>(
        <button
        style={{
            backgroundColor:"tomato",

        }}
        onClick={()=>console.log("클릭되었습니다.")}>
        클릭 
        </button>

    );
    
    

    const Cont= () => (
        <div> 
            
            <Title />
            <Button /> 
        </div>
    );

    ReactDOM.render(<Cont />, root);
     </script> 
</html>