Search
LanguageTranslator
@juleeyet
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
// Spinner Component
function Spinner({ theme }) {
const spinnerStyle = {
</div>
function App() {
const [theme, setTheme] = useState(() => {
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
client();
export default function server(request: Request): Response {
return new Response(`
dexie_example
@kucukkanat
// import { indexedDB } from "https://deno.land/x/indexeddb@v1.1.0/ponyfill_memory.ts";
Script
friends: "++id, name, age",
// Add some data
async function addFriend(name: string, age: number) {
await db.friends.add({ name, age });
// Query the data
async function getFriends() {
const friends = await db.friends.toArray();
console.log("Friends:", { friends });

truthfulAmethystParakeet
@stevekrouse
@jsxImportSource https://esm.sh/react
HTTP
import { tomorrow } from "https://esm.sh/react-syntax-highlighter/dist/esm/styles/prism";
function App() {
const [prompt, setPrompt] = useState("hello llamapalooza");
>(null);
async function handleSubmit(e: React.FormEvent) {
e.preventDefault();
</div>
function client() {
createRoot(document.getElementById("root")!).render(<App />);
client();
function extractCodeFromFence(text: string): string {
const htmlMatch = text.match(/```html\n([\s\S]*?)\n```/);
return htmlMatch ? htmlMatch[1].trim() : text;
export default async function server(req: Request): Promise<Response> {
if (req.method === "POST") {
myApi
@ralfw
An interactive, runnable TypeScript val by ralfw
Script
export function myApi(name) {
return "hi " + name;

myApi
@timur
An interactive, runnable TypeScript val by timur
Script
export function myApi(name) {
return "hi " + name;

polygonDailyAPI
@rwev
An interactive, runnable TypeScript val by rwev
Script
import process from "node:process";
import { fetchJSON } from "https://esm.town/v/stevekrouse/fetchJSON?v=41";
export async function polygonDailyAPI(ticker, date) {
return fetchJSON(
`https://api.polygon.io/v1/open-close/${ticker}/${date}?adjusted=true&apiKey=${process.env.POLYGON_API_KEY}`

limeDeer
@yawnxyz
this is used by a bunch of things as a "ping" so don't archive or delete it lol
Script
export default async function what() {
console.log("what");

emailMeWhenBadAirQuality
@logan
An interactive, runnable TypeScript val by logan
Script
import { lastRun } from "https://esm.town/v/logan/lastRun";
import process from "node:process";
export async function emailMeWhenBadAirQuality({ lat, long }: {
lat: number;
long: number;
CS1200SystemsDev
@stephencooley123
// Fetches a random joke.
Script
import { email } from "https://esm.town/v/std/email?v=9";
// Fetches a random joke.
async function fetchRandomJoke() {
const response = await fetch(
"https://official-joke-api.appspot.com/random_joke",
harmoniousMaroonFlyingfish
@Sm202020
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
function App() {
const [isLoggedIn, setIsLoggedIn] = useState(false);
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
const { sqlite } = await import("https://esm.town/v/stevekrouse/sqlite");

createTursoProxy
@pomdtr
Usage Create proxy val for your turso DB (make it private to protect it behind your val town token) import {createTursoProxy} from "https://esm.town/v/pomdtr/createTursoProxy"
export default createTursoProxy("<tursoDatabaseUrl>", "<tursoAuthToken>") Wire any existing val to the proxy val import { setEnv } from "https://esm.town/v/pomdtr/setEnv";
// use my private proxy
setEnv("VALTOWN_API_URL", "<proxy-url>");
// wire sqlite explorer to a turso db !
const { handler } = await import("https://esm.town/v/nbbaier/sqliteExplorerApp");
export default handler;
Script
import { Hono } from "jsr:@hono/hono";
import { createClient } from "npm:@libsql/client";
export function createTursoProxy(databaseUrl: string, authToken: string) {
const client = createClient({
url: `${databaseUrl}?authToken=${Deno.env.get("TURSO_AUTH_TOKEN")}`,

safeCounter
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Script
// 4. Get most up to date state
// Note 1: If I referenced @stevekrouse.threadsafeStateEx here
// it would return the value of that val at the beginning of this function,
// before I acquired the lock. I fetch it's value now to get the most up-to-date
// value of it, now that I know it can't be updated until I release this lock.

sayHello
@gera
An interactive, runnable TypeScript val by gera
Script
export function sayHello(name: string) {
console.log(`arg was ${name}`);
return `Hello, ${name}`;