Public
HTTP
Forked from stevekrouse/stevekrouse_minimal
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
/** @jsxImportSource https://esm.sh/react */
import { modifyFetchHandler } from "https://esm.town/v/andreterron/codeOnValTown?v=46";
import { sqlite } from "https://esm.town/v/std/sqlite?v=4";
import tailwindURL from "https://esm.town/v/stevekrouse/tailwindURL";
import { renderToString } from "npm:react-dom/server";
export const reactExample = modifyFetchHandler(async (request: Request) => {
const url = new URL(request.url);
if (url.pathname === "/favicon.ico") return new Response(null, { status: 404 });
const [, , data] = await sqlite.batch([
"CREATE TABLE IF NOT EXISTS stevekrouse_com_hits (timestamp DATETIME DEFAULT CURRENT_TIMESTAMP)",
"INSERT INTO stevekrouse_com_hits DEFAULT VALUES",
"SELECT COUNT(*) FROM stevekrouse_com_hits",
]);
const hits = data.rows[0][0];
return new Response(
renderToString(
<html>
<head>
<title>Steve Krouse</title>
<script src={tailwindURL} />
</head>
<body>
<div className="max-w-md p-10 space-y-2">
<div>
hi, I'm Steve 👋
</div>
<div>
i work at{" "}
<a href="https://val.town" className="text-blue-500 hover:text-blue-700">val town</a>, a social website to
code in the cloud. i tweet at{" "}
<a href="https://twitter.com/stevekrouse" className="text-blue-500 hover:text-blue-700">@stevekrouse</a>
</div>
<div>
{hits.toString()} hits |{" "}
<a
href="https://stevekrouse.github.io/"
className="text-blue-500 hover:text-blue-700"
style={{ transform: "rotate(90deg)" }}
>
previous version
</a>
</div>
</div>
</body>
</html>,
),
{
headers: {
"Content-Type": "text/html",
},
},
);
});
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
Comments
Nobody has commented on this val yet: be the first!
v0
March 12, 2024