React + HTM

by Devalnor

HTML

<head>
   <meta charset="UTF-8">
   <title>React + htm Demo</title>
   
   <script src="https://unpkg.com/htm@2.2.1" crossorigin></script>
   <script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
   <script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>
   
   <script type="module">
   const { createElement, useState } = React;
   const render = ReactDOM.render;
   const html = htm.bind(createElement);
   
   function ClickCounter() {
     const [count, setCount] = useState(0);
     
     return html`
       <div>
         <button onClick=${() => setCount(count + 1)}>
           Clicked ${count} times
         </button>
       </div>
     `;
   }
   
   render(html`<${ClickCounter}/>`, document.getElementById("App"));
   </script>
</head>

<body>
   <h1> React + htm Demo</h1>
   <div id="App"/>
</body>