Search
forbearingOrangeLemming
@c_lys
// 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",
valentine
@enochyaw
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
"You're wasting your time.",
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(
val_wjytJA6GCS
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export default async function handler(req) {
try {
const result = await (async () => {
function isPrime(num) {
if (num <= 1) return false;
return true;
function findLowestThreeDigitPrime() {
for (let num = 100; num < 1000; num++) {
request
@yieldray
An interactive, runnable TypeScript val by yieldray
Script
export function request(
info: RequestInfo,
init?: RequestInit & {
helloWorldGreeting
@Hemant
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
// Secure Authentication Component
function AuthenticationComponent({ onLogin }) {
const [mode, setMode] = useState('login');
// Voter Dashboard Component
function VoterDashboard({ onLogout }) {
const [selectedParty, setSelectedParty] = useState(null);
// Admin Dashboard Component
function AdminDashboard({ onLogout }) {
const [voteStats, setVoteStats] = useState([]);
</div>
function App() {
const [currentView, setCurrentView] = useState('auth');
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
const KEY = new URL(import.meta.url).pathname.split("/").at(-1);
git_sync
@saolsen
Sync vals to a git repo This will not run on val town! You need to run it locally with deno. Install Deno: https://docs.deno.com/runtime/manual/getting_started/installation Set your val.town api key as an environment variable. https://www.val.town/settings/api export valtown="abcdefgh-ijkl-mnop-qrst-uvwxyz123456" Create a git repo to sync to. mkdir ./valtown && pushd ./valtown && git init && popd Copy down this script and run it, passing the path to your git directory. deno run -A ./git_sync.ts ./valtown There is currently no incremental syncing or recovering. You can only use
this script against a fresh git repo. If you want to sync to an existing repo, you
should create a new repo, run the script and then force push to your existing repo. This will sync all your vals, including private ones so be careful where you
push your git repo if you want those to remain private.
Script
next?: string;
async function valtown(path: string): Promise<[number, object | null]> {
const req = await fetch(path, {
return [req.status, resp];
async function git(
args: string[],
// Get all the vals for the user.
async function getVals(me: User): Promise<Val[]> {
const vals = [];
// Write every version of the val to a file and commit it (unless there's no changes).
async function syncVals(vals: Val[]) {
for (let i = 0; i < vals.length; i++) {
progress.end();
export default async function main() {
// check for api key
myApi
@murdo
An interactive, runnable TypeScript val by murdo
Script
export function myApi(name) {
return "hi " + name;
web_k1upAyVCPh
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function web_k1upAyVCPh(req) {
return new Response(`<!DOCTYPE html>
<html>
valle_tmp_24901011813828427349436434809345
@janpaul123
// This val responds with an HTML form styled with fun CSS to input the user's name and greets them upon form submission
HTTP
// This val responds with an HTML form styled with fun CSS to input the user's name and greets them upon form submission
export default async function(req: Request): Promise<Response> {
if (req.method === "POST") {
const formData = new URLSearchParams(await req.text());
val_QEZMJDAFaF
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export default async function handler(req) {
try {
const result = await (async () => {
function isPrime(num) {
if (num <= 1) return false;
return true;
function findLowestThreeDigitPrime() {
for (let num = 100; num < 1000; num++) {
decorator_router
@yieldray
Decorator Router Fair simple decorator based router, with GET/POST and middleware support. demo live demo: https://yieldray-decorator_router_demo.web.val.run/ import { get, post, all, use, registered, handler, type Context } from "https://esm.town/v/yieldray/decorator_router";
import { parseBearerAuth, transformResponse } from "https://esm.sh/serve-router@1.1.0/utils";
interface User {
id: number;
name: string;
}
const users: User[] = [
{ id: 0, name: "Alice" },
{ id: 1, name: "Ray" },
];
class _Server {
/**
* Decorator @get: Parses URLSearchParams into an object as the first parameter.
*/
@get("/users")
getAllUsers() {
return users; // Automatically wrapped in a Response.json
}
@get("/getUserByName") // GET /getUserByName?name=Alice
getUserByName({ name }: Record<string, string>) {
const user = users.find((u) => u.name === name);
if (user) {
return user; // Automatically wrapped as Response.json(user)
}
// Optionally, manually return a Response object
return Response.json({ error: "not found" }, { status: 404 });
}
@get("/user/:id") // GET /user/123
user(_: unknown, { params: { id } }: Context) {
return users.find((u) => u.id === Number(id));
}
/**
* Decorator @post: Parses the request body into an object as the first parameter.
*/
@post("/user") // POST /user
async createUser(user: User) {
if (users.find((u) => u.id === user.id)) {
return { error: "already exists!" };
}
await users.push(user); // Assume insertion into a database
return { ok: true, users };
}
@post("/user/:id") // POST /user/123
async updateUser(user: User, { params: { id }, request }: Context) {
const token = parseBearerAuth(request.headers.get("Authorization")!);
// Additional logic here...
}
@all("/")
home({ request }: { request: Request }) {
return {
registered,
method: request.method,
url: request.url,
headers: Object.fromEntries(request.headers.entries()),
};
}
@use("/*")
async corsMiddleware({ next, request }: Context) {
const resp = await next();
return transformResponse(resp, {
headers: {
"Access-Control-Allow-Origin": request.headers.get("origin") || "*",
},
});
}
}
// For Deno:
Deno.serve(handler);
// For val.town:
export default handler;
Script
next: () => Promise<Response>;
export function get(path: string) {
return (
return Response.json(resp);
export function post(path: string) {
return (target: (body: any, ctx: Context) => unknown, _context: ClassMethodDecoratorContext) => {
return Response.json(resp);
export function all(path: string) {
return (target: (ctx: Context) => unknown, _context: ClassMethodDecoratorContext) => {
return Response.json(resp);
export function use(path: string) {
return (target: (ctx: Context) => unknown, _context: ClassMethodDecoratorContext) => {
immenseBlushSpider
@ngmi
An interactive, runnable TypeScript val by ngmi
HTTP
const API_KEY = Deno.env.get("FARCASTER_API_KEY");
const API_URL = "https://build.wield.xyz/farcaster/v2/feed";
export default async function server(request: Request): Promise<Response> {
let feedItems = [];
let error = null;
error = "API key is not set. Please configure the FARCASTER_API_KEY environment variable.";
} else {
async function fetchFeedItems() {
try {
const response = await fetch(`${API_URL}?limit=50`, {
GTF
@gitneukev
// Fetches a random joke.
Script
"punchline": "A cat-tastrophe.",
// Fetches a random joke.
function fetchRandomJoke() {
const SAMPLE_JOKE = {
"setup": "What do you call a group of disorganized cats?",
