Skip to content

Instantly share code, notes, and snippets.

@pazguille

pazguille/deno-jsx.jsx

Last active July 30, 2022 20:42
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pazguille/7a4e0569937d00abef45564d10542bd5 to your computer and use it in GitHub Desktop.
Save pazguille/7a4e0569937d00abef45564d10542bd5 to your computer and use it in GitHub Desktop.
Download ZIP
SSR Minimalist for Deno using JSX (Preact)
Raw
deno-jsx.jsx
/** @jsx h */
/** @jsxFrag Fragment */
import { Fragment, h } from "https://esm.sh/preact";
import { render } from "https://esm.sh/preact-render-to-string";
function HelloWorld({ name }) {
return <p>Hello {name}!</p>;
}
const html = await render(
<>
<h1>Deno con Preact</h1>
<HelloWorld name="World" />
</>
);
console.log(html);
Raw
deno-ssr.jsx
/** @jsx h */
/** @jsxFrag Fragment */
import { h, Fragment } from "https://esm.sh/preact";
import { render } from "https://esm.sh/preact-render-to-string";
import { serve } from "https://deno.land/std@0.140.0/http/server.ts";
function HelloWorld({ name }) {
return <p>Hello {name}!</p>;
}
function App() {
return (
<html>
<head>
<title>Deno + JSX</title>
</head>
<body>
<>
<h1>Deno con Preact</h1>
<HelloWorld name="World" />
</>
</body>
</html>
);
}
function handler() {
const html = render(<App />);
return new Response(html, {
headers: {
"content-type": "text/html",
},
});
}
serve(handler, { port: 3030 });
// deno run --allow-net=:3030 https://gist.githubusercontent.com/pazguille/7a4e0569937d00abef45564d10542bd5/raw/12e31508adc92591fbcfde163571f73da2bda63c/deno-ssr.jsx
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment