Search

Storyweaver

@aioe0x417a

@jsxImportSource https://esm.sh/react

HTTP

/** @jsxImportSource https://esm.sh/react */

import React, { useState, useRef } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

function LoadingSpinner() {

const fileInputRef = useRef<HTMLInputElement>(null);

const handleImageUpload = async (event: React.ChangeEvent<HTMLInputElement>) => {

const file = event.target.files?.[0];

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") { client(); }

// Utility function to implement timeout

valwriter

@janpaul123

[ ] streaming [ ] send the code of the valwriter back to gpt (only if it's related, might need some threads, maybe a custom gpt would be a better fix, of course, could do it as a proxy...) [ ] make it easy to send errors back to gpt [ ] make it easy to get screenshots of the output back to gpt

HTTP

const examples = [

user: "website that shows the current time",

content: `/** @jsxImportSource npm:react */

export default function() {

return <h1>{new Date().toLocaleTimeString()}</h1>;

evanescentLavenderGuineafowl

@mazafard

@jsxImportSource https://esm.sh/react@18.2.0

HTTP

/** @jsxImportSource https://esm.sh/react@18.2.0 **/

import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";

export default (req: Request) => {

return new Response(

linkInBioTemplate

@ghsaboias

@jsxImportSource https://esm.sh/react

HTTP

/** @jsxImportSource https://esm.sh/react */

import { renderToString } from "npm:react-dom/server";

export default async function(req: Request) {

return new Response(

exceptionalBlueBear

@Ruvi123

@jsxImportSource https://esm.sh/react

HTTP

/** @jsxImportSource https://esm.sh/react **/

import { renderToString } from "https://esm.sh/react-dom@18/server";

export default (req: Request) => {

return new Response(

friend

@robh3

An interactive, runnable TypeScript val by robh3

Script

import { S3Client } from "https://deno.land/x/s3_lite_client@0.6.1/mod.ts";

const cloudflareR2client = new S3Client({

endPoint: Deno.env.get("cloudflareR2Endpoint"), // This stores as secrets in val.town

let currentDate = new Date().toISOString(); // Otherwise, we take the current date

await cloudflareR2client.putObject("transcription-" + currentDate + ".json", req.body);

return Response.json({ ok: true });

bonsai

@loading

@jsxImportSource https://esm.sh/react

HTTP

/** @jsxImportSource https://esm.sh/react */

import React from "https://esm.sh/react";

import { renderToString } from "https://esm.sh/react-dom/server";

function createScreenBuffer(width: number, height: number): string[][] {

safeBlushRabbit

@semisemsem

@jsxImportSource https://esm.sh/react@18.2.0

HTTP

/** @jsxImportSource https://esm.sh/react@18.2.0 */

import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";

import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";

// Turkish day abbreviations

: [...prev, date]

const handleSubmit = async (e: React.FormEvent) => {

e.preventDefault();

</div>

function client() {

const root = document.getElementById("root");

createRoot(root).render(<App />);

if (typeof document !== "undefined") { client(); }

export default async function server(request: Request): Promise<Response> {

lastlogindemo

@apitman

An interactive, runnable TypeScript val by apitman

HTTP

function doAuth(provider) {

const params = new URLSearchParams();

params.set('client_id', window.location.href);

params.set('redirect_uri', window.location.href);

params.set('scope', 'openid email profile');

comfortablePlumSeahorse

@anouaraissaoui

@jsxImportSource https://esm.sh/react

HTTP

/** @jsxImportSource https://esm.sh/react **/

import { renderToString } from "https://esm.sh/react-dom@18/server";

export default (req: Request) => {

return new Response(

staticChess

@maxm

Check it out here: https://chess.maxmcd.com Plain, brutalist, no bloat chess. Every page is only html and css. Every chess move is made by clicking a link. Send a link to your friend and they'll send you one back to make your move. No silly animations or slick interactivity to trip up your gameplay. When Google indexes this site will we successfully compute all possible chess moves? Functionality is quite limited, and things might be broken. Please let me know if you find bugs! Inspired by this HN discussion about sites that have all possible game states of tic-tac-toe. I plan on extending this to support real gameplay. I think it could be a nice simple interface for long form games with friends. Might also be fun to add a static AI to play against. Feel free to PR any changes if you'd like to see something added.

7 7 4

HTTP

/** @jsxImportSource https://esm.sh/react */

import { analyticsHandlerWrapper } from "https://esm.town/v/maxm/valTownAnalytics";

import { Chess, Move, Square } from "npm:chess.js";

import minify from "npm:css-simple-minifier";

import { renderToString } from "npm:react-dom/server";

class StaticChess {

size = 8;

renderHTMLWithHono

@tristanmagne

// This val uses Hono, a lightweight web framework, to create a simple HTML page.

HTTP

// This val uses Hono, a lightweight web framework, to create a simple HTML page.

// It demonstrates how to use Hono's HTML templating and routing capabilities.

// Side note: This code is generated using Townie AI.

import { Hono } from "jsr:@hono/hono";

import { html } from "jsr:@hono/hono/html";

valTownAnalytics

@maxm

Val Town Analytics WIP!

1 6

HTTP

/** @jsxImportSource https://esm.sh/react */

import { DateTime } from "https://cdn.skypack.dev/luxon@2.3.2";

import { extractValInfo } from "https://esm.town/v/pomdtr/extractValInfo?v=27";

import { sqlite } from "https://esm.town/v/std/sqlite?v=6";

import { renderToString } from "npm:react-dom/server";

const { author, name, httpEndpoint } = extractValInfo(import.meta.url);

sqlite.batch([

wideApi

@maxm

An interactive, runnable TypeScript val by maxm

HTTP

import { zValidator } from "npm:@hono/zod-validator";

import { Hono } from "npm:hono";

import { hc } from "npm:hono/client";

import { createMiddleware } from "npm:hono/factory";

import { HTTPException } from "npm:hono/http-exception";

switchbot_party

@stevekrouse

Switchbot Party We hosted a party in the Val Town office and I texted a link to this site to all guests: You can see a demo here: https://x.com/stevekrouse/status/1819018859099132128 After the party was over, I commented out the lines that open the door so folks can't use it anymore.

HTTP

const partyStatus = getPartyStatus();

if (!partyStatus.active) {

email({ subject: "Door tried to be opened outside party hours!" });

const now = Temporal.Now.zonedDateTimeISO(NYC_TIMEZONE);

let message;

…

69 70

72 73

…

252