JSFiddle - React, Tailwind, and code Playground

by qenglisq

HTML

<!DOCTYPE html>
<html>
  <body>
    <script type="module">
      import { onCleanup, createSignal } from "https://esm.sh/solid-js@1.8.1";
      import { render } from "https://esm.sh/solid-js@1.8.1/web";
      import html from "https://esm.sh/solid-js@1.8.1/html";
      
      const Foo = (props) => html`<em>FOO ${props.x*2}</em>`;

      const App = () => {
      	const [count, setCount] = createSignal(0);
      	const timer = setInterval(() => setCount(count() + 1), 1000);
        onCleanup(() => clearInterval(timer));
        return html`<div><div>${count}</div>${() => Foo({x: count()})}</div>`;
      };
      
      render(App, document.body);
    </script>
  </body>
</html>