diff --git a/.gitignore b/.gitignore index 5f427ca..13e7b3d 100644 --- a/.gitignore +++ b/.gitignore @@ -7,6 +7,8 @@ yarn-error.log* pnpm-debug.log* lerna-debug.log* +bun.lockb + # Dependencies node_modules .yarn/* diff --git a/App.js b/App.js index 4bb7927..0896eb3 100644 --- a/App.js +++ b/App.js @@ -1,37 +1,23 @@ import { createElement, useState } from "react" +import htm from "htm" + +const html = htm.bind(createElement) function App() { const [count, setCount] = useState(0) - return createElement( - "div", - { className: "App" }, - createElement( - "a", - { href: "https://react.dev/", target: "_blank" }, - createElement("img", { - src: "/react.svg", - className: "logo", - alt: "React logo", - }), - ), - createElement("h1", {}, "React"), - createElement( - "div", - { className: "card" }, - createElement( - "button", - { onClick: () => setCount((count) => count + 1) }, - "count is ", - count, - ), - ), - createElement( - "p", - { className: "read-the-docs" }, - "Click on the React logo to learn more", - ), - ) + return html`
` } export default App diff --git a/index.html b/index.html index 9f233e6..85e3f27 100644 --- a/index.html +++ b/index.html @@ -16,7 +16,8 @@ "react": "https://esm.sh/react", "react/": "https://esm.sh/react/", "react-dom": "https://esm.sh/react-dom", - "react-dom/": "https://esm.sh/react-dom/" + "react-dom/": "https://esm.sh/react-dom/", + "htm": "https://esm.sh/htm" } }