Search
azureWombat
@karlstens
@jsxImportSource npm:react
HTTP (deprecated)
/** @jsxImportSource npm:react **/
export default (req: Request) => {
const styles = `
@keyframes rainbow-text {
0% { color: red; }
15% { color: orange; }
30% { color: yellow; }
45% { color: green; }
60% { color: blue; }
75% { color: indigo; }
userspaceAuth
@maxm
@jsxImportSource https://esm.sh/preact
HTTP (deprecated)
/** @jsxImportSource https://esm.sh/preact */
// import * as opaque from "npm:@cloudflare/opaque-ts";
const resp = (content, status) =>
new Response(render(content), {
status,
headers: {
"Content-Type": "text/html",
const trimSuffix = (s: string, suffix: string): string => {
if (!s.endsWith(suffix)) {
return s;
upstashExample
@yawnxyz
An interactive, runnable TypeScript val by yawnxyz
Script
import { Redis } from "npm:@upstash/redis";
const redis = new Redis({
url: Deno.env.get("upstashValtownUrl"),
token: Deno.env.get("upstashValtownToken"),
console.log(await redis.set("foo", "bar"));
console.log(await redis.get("foo"));
Server2
@iamseeley
🚧 hono + htmx web app 🚧 idea: linktree-esque profile page w/ widgets powered by vals setup: fork the val and uncomment the /signup and /login routes create a jwt secret token environment variable go to the db setup val and run it to create the tables (as the site is right now, you can only add/edit users and add/edit/delete user links) to do: [ ] create some val town apis for the profile widgets (add vals people have already made) [ ] add profile image (will probably point to val town profile pic) [ ] add delete profile handler [ ] finish public profile page [ ] 🎨🎨🎨🎨🎨
HTTP (deprecated)
# 🚧 hono + htmx web app 🚧
### idea: linktree-esque profile page w/ widgets powered by vals
### setup:
- *fork the val and uncomment the /signup and /login routes*
- *create a jwt secret token environment variable*
- *go to the db setup val and run it to create the tables* (as the site is right now, you can only add/edit users and add/edit/delete user links)
/** @jsxImportSource https://esm.sh/hono@latest/jsx **/
const app = new Hono();
app.use(logger());
const SECRET_KEY = Deno.env.get("JWT_SECRET_TOKEN");
getsynesthesiacounter
@politelyinvinciblepointer
An interactive, runnable TypeScript val by politelyinvinciblepointer
Script
import { synesthesiacounter } from "https://esm.town/v/politelyinvinciblepointer/synesthesiacounter";
export function getsynesthesiacounter() {
return synesthesiacounter;
valle_tmp_98139518017595684072811081715226
@janpaul123
// Initialize sample stories and store them in blob storage
HTTP (deprecated)
// Initialize sample stories and store them in blob storage
const SAMPLE_STORIES_KEY = "hn_sample_stories";
async function initializeSampleStories() {
const existingStories = await blob.getJSON(SAMPLE_STORIES_KEY);
if (!existingStories) {
const sampleStories = Array.from({ length: 30 }).map((_, idx) => ({
id: idx + 1,
title: `Sample Story ${idx + 1}`,
url: `https://example.com/story${idx + 1}`,
votes: Math.floor(Math.random() * 100),
mootex
@maxm
HTTP (deprecated)
<h1 align=center>🐮 mootex</h1>
/** @jsxImportSource https://esm.sh/react */
// Example code snippet
const codeExample = `import mootex from "https://esm.sh/mootex"
// Acquire a lock from anywhere.
await mootex.lock("cow")
// Lock acquired. It's cow time.
// Release the lock
await mootex.unlock("cow")
// Component to render the code with syntax highlighting
fetchRssParser
@shellphon
An interactive, runnable TypeScript val by shellphon
Script
import { fetch } from "https://esm.town/v/std/fetch";
export async function fetchRssParser(rssUrl) {
// fetch the rss xml
const rssResult = await fetch(rssUrl).then((res) => res.text());
// parse xml to object
const { XMLParser } = await import("npm:fast-xml-parser");
const parser = new XMLParser();
let jObj = parser.parse(rssResult);
return jObj;
supir
@turbo1912
@jsxImportSource https://esm.sh/react
Cron
/** @jsxImportSource https://esm.sh/react */
export default async function(interval: Interval) {
const result = await fal.subscribe("fal-ai/supir", {
input: {
image_url: "https://storage.googleapis.com/falserverless/gallery/NOCA_Mick-Thompson.resized.resized.jpg",
logs: true,
onQueueUpdate: (update) => {
if (update.status === "IN_PROGRESS") {
update.logs.map((log) => log.message).forEach(console.log);
console.log(result.image.url);
cardRepaymentCalculator
@lifonnnn
* This credit card payoff calculator app allows users to:
* 1. Add and remove multiple credit cards with their balances and interest rates
* 2. Calculate monthly payments based on desired payoff time
* 3. View individual card payoff information
* 4. See a combined view of all cards
* 5. Visualize payoff data with different types of charts
*
* It uses React for the UI, SQLite for data persistence, and Chart.js for visualization.
* The app is now optimized for mobile devices with responsive design.
HTTP
* This credit card payoff calculator app allows users to:
* 1. Add and remove multiple credit cards with their balances and interest rates
* 2. Calculate monthly payments based on desired payoff time
* 3. View individual card payoff information
* 4. See a combined view of all cards
* 5. Visualize payoff data with different types of charts
* It uses React for the UI, SQLite for data persistence, and Chart.js for visualization.
* The app is now optimized for mobile devices with responsive design.
/** @jsxImportSource https://esm.sh/react */
interface CreditCard {
test2
@spolu
An interactive, runnable TypeScript val by spolu
Script
import { test1 } from "https://esm.town/v/spolu/test1";
export let test2 = async () => {
console.log("HI3");
return test1();
html
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Script
export let html = (content, options = {}) =>
new Response(content, {
headers: {
"Content-Type": "text/html",
...(options.headers ?? {}),
orangePiranha
@nethanmadhav
// Fetches a random joke.
Cron
// ... imports ...
// Fetches a random joke.
async function fetchRandomJoke() {
const response = await fetch(
"https://official-joke-api.appspot.com/random_joke",
return response.json();
const randomJoke = await fetchRandomJoke();
const setup = randomJoke.setup;
const punchline = randomJoke.punchline;
// ... email sending logic ...
sqliteExplorerApp
@kamek
SQLite Explorer View and interact with your Val Town SQLite data. It's based off Steve's excellent SQLite Admin val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by LibSQL Studio by invisal . This is now more an SPA, with tables, queries and results showing up on the same page. Install Install the latest stable version (v81) by forking this val: Authentication Login to your SQLite Explorer with password authentication with your Val Town API Token as the password. Todos / Plans [ ] improve error handling [ ] improve table formatting [ ] sticky table headers [x] add codemirror [ ] add loading indication to the run button (initial version shipped) [ ] add ability to favorite queries [ ] add saving of last query run for a table (started) [ ] add visible output for non-query statements [ ] add schema viewing [ ] add refresh to table list sidebar after CREATE/DROP/ALTER statements [ ] add automatic execution of initial select query on double click [x] add views to the sidebar [ ] add triggers to sidebar [ ] add upload from SQL, CSV and JSON [ ] add ability to connect to a non-val town Turso database [x] fix wonky sidebar separator height problem (thanks to @stevekrouse) [x] make result tables scrollable [x] add export to CSV, and JSON (CSV and JSON helper functions written in this val . Thanks to @pomdtr for merging the initial version!) [x] add listener for cmd+enter to submit query
HTTP (deprecated)
# SQLite Explorer
View and interact with your Val Town SQLite data. It's based off Steve's excellent [SQLite Admin](https://www.val.town/v/stevekrouse/sqlite_admin?v=46) val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by [LibSQL Studio](https://github.com/invisal/libsql-studio) by [invisal](https://github.com/invisal). This is now more an SPA, with tables, queries and results showing up on the same page.
## Install
Install the latest stable version (v81) by forking this val:
[)](https://www.val.town/v/nbbaier/sqlite_explorer/fork)
/** @jsxImportSource https://esm.sh/hono@latest/jsx **/
EditorSection,
MockTable,
Separator,
