Note

html에서 react 사용하기

zdiv 2023. 8. 5. 23:17
<html><head>
<script src="https://unpkg.com/react/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head><body>

<div id="root"></div>

<script type="text/babel">
const root = ReactDOM.createRoot(
  document.getElementById('root')
);

function tick() {
  const element = (
    <div>
      <h1>Hello, world!</h1>
      <h2>It is {new Date().toLocaleTimeString()}.</h2>
    </div>
  );
  root.render(element);
}

setInterval(tick, 1000);
</script>
</body></html>

 

 

'Note' 카테고리의 다른 글

fastapi + jinja2 + webpack + chart.js + matplotlib  (0) 2023.08.12
express + webpack + chart.js + jquery  (0) 2023.08.06
express + fetch + chart.js  (0) 2023.08.01
express로 nodejs 웹서버 만들기  (0) 2023.07.30
Bootstrap Collapse with Indicator  (0) 2023.07.23