<script type="module">
  import { createSignal, createEffect } from "https://cdn.skypack.dev/solid-js@1.2.6";
  import html from "https://cdn.skypack.dev/solid-js@1.2.6/html";

  const [
    count, // getter
    setCount // setter
  ] = createSignal(0)

  setInterval(() => {
    // Increment count every second 
    setCount(count() + 1)
  }, 1000)

  createEffect(() => {
    // log count whenever it changes
    console.log(count())
  })

  // This HTMLDivElement will be updated every second
  const div = html`<div>count: ${count}</div>`

  document.body.append(div) // It is DOM, not vdom.
</script>
div {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 5rem;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.