Search
tanChimpanzee
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
HTTP
import { html } from "https://esm.town/v/stevekrouse/html";
import { reloadOnSaveMiddleware } from "https://esm.town/v/stevekrouse/reloadOnSave";
export default reloadOnSaveMiddleware(async function(req: Request): Promise<Response> {
return html(`<h1>Hello 3!!</h1>`);
valentine
@halooo
Hello!!! Feel free to mess around with this val and make it your own :). Just click on "Fork" in the top right. You can change the phrases that show up as you click no, you can change the firstImg and secondImg, maybe even add more images. And you can also change the colors and any of the text on the screen! Have fun with it and hopefully your crush says yes hehe.
HTTP
"SAY YESS!!!😤",
function App() {
const [noClicks, setNoClicks] = useState(0);
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
return new Response(
imggenpro
@andiebuk
Example usage: https://your-val.val.run?image=a%20beautiful%20sunset (uses default 1024x768)
https://your-val.val.run?image=a%20beautiful%20sunset&width=512&height=512 (uses 512x512)
https://your-val.val.run?image=a%20beautiful%20sunset&width=4096&height=4096 (will cap at 2048x2048) This uses together.ai api and generates the image using the black-forest-labs/FLUX.1-schnell model which is very fast. You will need to set the environment var TOGETHER_API_KEY to your key. I built this entirely with Townie AI and most of it was done with the Claude 3.5 Haiku which I find for most projects get things right faster than sonnet.
HTTP
import { createRoot } from "https://esm.sh/react-dom/client";
function App() {
const [prompt, setPrompt] = useState("");
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
client();
// Utility function to validate and adjust image dimensions
function validateImageDimensions(width: number, height: number): {
width: number,
warnings
export default async function server(request: Request): Promise<Response> {
const url = new URL(request.url);
homepage
@csl_
Got a domain for vals; needs a homepage; minimal effort
HTTP
import { createRoot } from "https://esm.sh/react-dom/client";
function App() {
const subheadings = [
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
async function server(request: Request): Promise<Response> {
return new Response(
hnFollowApp
@omerco
HN Follow – Follow your friends on HN HN Follow lets you follow authors on Hacker News, and get email notifications when they post. It was inspired by alerthn.com and hnreplies.com. Usage Create a cron val with the a list of the people you want to follow in a JS array, like so: export const hnFollow = hnFollowApp([
"pg",
"sama",
"geoff",
"stevewoz",
"tlb",
"harj",
"alankay",
"worrydream",
"norvig",
"dalton",
"mwseibel",
"katm",
"brianchesky",
"dang",
]);
Script
import { email } from "https://esm.town/v/std/email?v=9";
import { hnLatestPosts } from "https://esm.town/v/stevekrouse/hnLatestPosts?v=18";
export const hnFollowApp = function(authors: string[]) {
return async function({ lastRunAt }) {
let posts = await hnLatestPosts({
authors,
vtu_TestSupport
@rozek
(trivial support for automated tests, inspired by https://www.val.town/v/jxnblk/test, documentation follows)
Script
let beforeEachFns:Function[] = []
let afterEachFns:Function[] = []
let beforeAllFns:Function[] = []
let afterAllFns:Function[] = []
export async function describe (
CollectionName:string, Collection:Function
export async function xdescribe (
CollectionName:string, Collection:Function
export async function it (
SpecName:string, Spec:Function, Timeout:number = 2000
todepondLabLoginGetUsers
@netux
An interactive, runnable TypeScript val by netux
HTTP
import * as bcrypt from "https://deno.land/x/bcrypt@v0.4.1/mod.ts";
import { sqlite } from "https://esm.town/v/std/sqlite";
export default async function(req: Request): Promise<Response> {
const TABLE_NAME = "todepond_lab_login_users_with_times";
// get status, name, and last_updated cols
calmRoseCaterpillar
@hameed
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
function App() {
const [functionInput, setFunctionInput] = useState("");
body: JSON.stringify({ function: functionInput }),
functionDescription: functionInput,
<h1 style={styles.title}>🔍 Function Diagram Generator</h1>
value={functionInput}
onChange={(e) => setFunctionInput(e.target.value)}
placeholder="Paste your function here... (JavaScript/TypeScript)"
function client() {
export default async function server(request: Request): Promise<Response> {
MandelbrotFractalApp
@madaju
@jsxImportSource https://esm.sh/react
HTTP
import { createRoot } from "https://esm.sh/react-dom/client";
function MandelbrotFractal() {
const canvasRef = useRef(null);
</div>
function App() {
return <MandelbrotFractal />;
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
return new Response(`
test_auth
@pomdtr
example for @pomdtr/auth_middleware
HTTP
import { auth } from "https://esm.town/v/pomdtr/auth_middleware";
async function handler(req: Request): Promise<Response> {
return new Response("You are authenticated!");
export default auth(handler);
bikeInventory
@all
@jsxImportSource https://esm.sh/react
HTTP
const APP_ID = "5518c0f9-481c-4aa8-85cd-eee42bd45319";
function BikeWindow({ bike, onSave, onClose, title }) {
const [brand, setBrand] = useState(bike?.brand || "");
</div>
function App() {
const [bikes, setBikes] = useState([]);
</div>
function client() {
console.log("Client function called");
const root = document.getElementById("root");
if (typeof document !== "undefined") {
console.log("Document is defined, calling client function");
client();
console.log("Document is undefined, skipping client-side rendering");
async function server(request: Request): Promise<Response> {
console.log("Server function called");
return new Response(
blogRSSTracker
@ianvph
An interactive, runnable TypeScript val by ianvph
Cron
import { newestBlogLink } from "https://esm.town/v/ianvph/newestBlogLink";
import { parseXML } from "https://esm.town/v/stevekrouse/parseXML?v=1";
export async function blogRSSTracker() {
// gets newest blog from rss feed
const blogRSSLink = "https://posthog.com/rss.xml";
daringBlushLimpet
@LewisMcC
for ashleigh :)
HTTP
"Don't break my heart :(",
function App() {
const [noClicks, setNoClicks] = useState(0);
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
client();
export default async function server(request: Request): Promise<Response> {
return new Response(
SAMPLE_JOKE
@fariasn516
// Fetches a random joke.
Cron
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",
runErrorEmail
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Script
import { truncateString } from "https://esm.town/v/patrickjm/truncateString?v=2";
import { runs as runs2 } from "https://esm.town/v/stevekrouse/runs";
export function runErrorEmail(data) {
type Then<T> = T extends Promise<infer U> ? U : never;
let runs = data.data as Then<