1/** @jsxImportSource https://esm.sh/react */
2import React, { useState, useEffect } from "https://esm.sh/react";
3import { createRoot } from "https://esm.sh/react-dom/client";
4import { Tldraw } from "https://esm.sh/@tldraw/tldraw@2.3.0";
5
1tldraw example with builder, for consistent React versions.
2
3Migrated from folder: Archive/server
1/** @jsxImportSource https://esm.sh/react */
2import { renderToString } from "npm:react-dom/server";
3
4import React from "https://esm.sh/react";
5import { createRoot } from "https://esm.sh/react-dom/client";
6
7function App() {
2 * This request collector val saves information about incoming requests
3 * and displays summary statistics on the home page. It uses SQLite for
4 * persistence and server-side React for rendering the UI. Users can click
5 * on a request ID to view full details of that request.
6 */
7
8/** @jsxImportSource https://esm.sh/react */
9import React from "https://esm.sh/react";
10import { renderToString } from "https://esm.sh/react-dom/server";
11
12interface RequestData {
1/**
2 * This val creates a Postman-like interface for testing HTTP requests directly in the browser.
3 * It uses React for the UI and the Fetch API to make requests.
4 * The server function serves the HTML and handles the API requests.
5 */
6
7/** @jsxImportSource https://esm.sh/react */
8import React, { useState } from "https://esm.sh/react";
9import { createRoot } from "https://esm.sh/react-dom/client";
10
11function App() {
1/** @jsxImportSource npm:preact */
2import { render } from "npm:preact-render-to-string";
3
4export function it(name, fn) {
4 */
5
6/** @jsxImportSource https://esm.sh/react */
7import React, { useState, useRef, useEffect } from "https://esm.sh/react";
8import { createRoot } from "https://esm.sh/react-dom/client";
9
10interface MemeTemplate {
134 };
135
136 const handleSubmit = (e: React.FormEvent) => {
137 e.preventDefault();
138 generateMeme();
1/** @jsxImportSource https://esm.sh/react */
2import React, { useState } from "https://esm.sh/react";
3import { createRoot } from "https://esm.sh/react-dom/client";
4import type { User } from "https://esm.town/v/stevekrouse/zod_demo_shared";
5
9 const [serverResponse, setServerResponse] = useState<string>("");
10
11 const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
12 const { name, value } = e.target;
13 setUser(prev => ({ ...prev, [name]: name === "age" ? parseInt(value) || 0 : value }));
14 };
15
16 const handleSubmit = async (e: React.FormEvent) => {
17 e.preventDefault();
18 setErrors({});
2
3* @stevekrouse/zod_demo_http (this val)
4* @stevekrouse/zod_demo_frontend (client-side react component)
5* @stevekrouse/zod_demo_shared (code that is imported in both vals, but only run on the backend)
6
5 * and server-sent events for real-time streaming of compliments.
6 */
7/** @jsxImportSource https://esm.sh/react */
8import React, { useState, useEffect, useRef } from "https://esm.sh/react";
9import { createRoot } from "https://esm.sh/react-dom/client";
10import { marked } from "https://esm.sh/marked";
11