Public
HTTP (deprecated)
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
/** @jsxImportSource https://esm.sh/react@17.0.2 */
import { renderToString } from "https://esm.sh/react-dom@17.0.2/server";
import React from "https://esm.sh/react@17.0.2";
const gradientBackground: React.CSSProperties = {
background: "linear-gradient(135deg, #00a8e8 0%, #007ea7 100%)",
minHeight: "100vh",
display: "flex",
alignItems: "center",
justifyContent: "center",
};
const containerStyle: React.CSSProperties = {
padding: "30px",
width: "300px",
fontFamily: "sans-serif",
textAlign: "center",
backgroundColor: "rgba(255, 255, 255, 0.1)",
borderRadius: "20px",
backdropFilter: "blur(10px)",
boxShadow: "0 10px 30px rgba(0, 0, 0, 0.1)",
};
const headingStyle: React.CSSProperties = {
color: "#ffffff",
marginBottom: "10px",
};
const subheadingStyle: React.CSSProperties = {
color: "#e0f7fa",
marginBottom: "20px",
};
const buttonContainerStyle: React.CSSProperties = {
display: "flex",
flexDirection: "column",
gap: "15px",
};
const buttonStyle: React.CSSProperties = {
padding: "12px",
color: "#007ea7",
backgroundColor: "#ffffff",
borderRadius: "25px",
textDecoration: "none",
fontWeight: "bold",
transition: "all 0.3s ease",
boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
};
export default async function handler(req: Request): Promise<Response> {
const html = renderToString(
<html>
<head>
<meta charSet="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Heather Cooper</title>
</head>
<body style={gradientBackground}>
<div style={containerStyle}>
<h1 style={headingStyle}>Heather Cooper</h1>
<p style={subheadingStyle}>AI Educator & Consultant</p>
<div style={buttonContainerStyle}>
<a href="https://www.instagram.com/joeschmo" style={buttonStyle}>Instagram</a>
<a href="https://github.com/cheribc" style={buttonStyle}>Github</a>
<a href="https://heatherbcooper.com/" style={buttonStyle}>Website</a>
<a href="https://x.com/HBCoop_" style={buttonStyle}>X</a>
<a href="https://www.youtube.com/@Visually_AI" style={buttonStyle}>YouTube</a>
<a href="https://heatherbcooper.substack.com/" style={buttonStyle}>Substack</a>
</div>
</div>
</body>
</html>,
);
return new Response(html, {
headers: {
"Content-Type": "text/html",
},
});
}