sift_nanossr.jsx

/** @jsx h */
import { h, json, jsx, serve } from "https://deno.land/x/sift@0.5.0/mod.ts";
import { ssr } from "https://crux.land/nanossr@0.0.5";

const App = () => (
  <div>
    <h1>Hello world!</h1>
  </div>
);

const NotFound = () => (
  <div>
    <h1>Page not found</h1>
  </div>
);

const Hello = (props) => (
  <div class={`bg-white flex h-screen`}>
    <h1 class={`text-5xl text-gray-900 m-auto mt-20`}>
      Hello {props.name}!
    </h1>
  </div>
);

serve({
  "/": () => jsx(<App />),
  "/api": () => json({ message: "Hello world" }),
  "/hello": (req) => {
      const url = new URL(req.url);
      const name = url.searchParams.get("name") ?? "world";
      console.log(`Name: ${name}`);
      return ssr(() => <Hello name={name} />);
  },
  404: () => jsx(<NotFound />, { status: 404 }),
});