Search results for "react client side"

validators

@devdoshi

Usage: async (rawInput) => { const validators = await @devdoshi.validators(); const inputSchema = validators.inputSchema(); const input = inputSchema.safeParse(rawInput); }

1

0

Script

Usage:

```javascript

async (rawInput) => {

const validators = await @devdoshi.validators();

const inputSchema = validators.inputSchema();

const input = inputSchema.safeParse(rawInput);

export const validators = async () => {

const { z } = await import("npm:zod");

const inputSchema = () =>

z.object({

sdk

@breadchris

An interactive, runnable TypeScript val by breadchris

0

Script

import { setup } from "https://esm.town/v/webscale/setup";

export const sdk = setup;

entireGoldLark

@nlnhsr

An interactive, runnable TypeScript val by nlnhsr

1

0

HTTP

type: "json",

export type ServiceOptions = {

* If true, the service will ask for a key to access. The value of the key

* is stored as BB_SERVICE_KEY environment variable.

* Default: false.

private?: boolean;

* A way to specify inputs, overriding the default inputs provided by `invoke`.

* Default: undefined.

inputs?: Record<string, any>;

const kits = [

notifyHackerNewsReplies

@chet

An interactive, runnable TypeScript val by chet

0

Cron

const username = "ccorcos";

export default async function(interval: Interval) {

const url = "https://news.ycombinator.com/threads?id=" + username;

const html = await fetchText(url);

console.log("html", html.slice(0, 100));

const { document } = (new JSDOM(html)).window;

const comments = Array.from(document.querySelectorAll(".athing.comtr")) as any[];

const currentIds = new Set(comments.map(x => x.id));

const newIds = new Set(comments.map(x => x.id));

const key = "hn2:" + username;

flashBorder

@iamseeley

An interactive, runnable TypeScript val by iamseeley

2

0

Script

export function flashBorder(element) {

if (!element) return;

let flash = true;

setInterval(() => {

if (flash) {

element.style.borderRightColor = 'transparent';

} else {

element.style.borderRightColor = '#fff';

flash = !flash;

}, 750);

generateQR

@galligan

// fetch("https://api.val.town/v1/express/galligan.generateQR?url={url}"

1

Script

// fetch("https://api.val.town/v1/express/galligan.generateQR?url={url}"

// QR Code Generator

// 1. Right click on the bookmarks bar and add new bookmark

// 2. Give it any name (Ex: QR Code)

// 3. For the URL, enter the below value

// javascript:void(open('https://api.val.town/v1/express/ramkarthik.generateQR?url='+encodeURIComponent(location.href), 'O

// 4. Save the bookmark

// 5. When you are on any page, click the newly added bookmark

// It should generate a QR code that you can scan and open on your mobile

export async function generateQR(req, res) {

spellbindingAmberSwift

@brockjeppesen

An interactive, runnable TypeScript val by brockjeppesen

0

HTTP

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

return Response.json({ ok: true })

freeform

@pomdtr

An interactive, runnable TypeScript val by pomdtr

1

0

Script

import { Inspector } from "https://esm.sh/@observablehq/inspector";

globalThis.width = window.innerWidth;

const style = document.createElement("style");

style.innerText =

":root{--syntax_normal:#1b1e23;--syntax_comment:#a9b0bc;--syntax_number:#20a5ba;--syntax_keyword:#c30771;--syntax_atom:#10a

document.head.appendChild(style);

export function display(val) {

const d = document.body.appendChild(document.createElement("div"));

const inspector = new Inspector(d);

inspector.fulfilled(val);

valle_tmp_36549593302312316221638155580223

@janpaul123

// This val serves an HTML page with an input field to enter a name. Upon form submission, it greets the user with the entered name.

0

HTTP

// This val serves an HTML page with an input field to enter a name. Upon form submission, it greets the user with the entere

// We'll handle the form submission using a POST request.

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

const html = `

<!DOCTYPE html>

<head>

<title>Greetings Form</title>

pyodidePowersVis

@iamseeley

An interactive, runnable TypeScript val by iamseeley

0

HTTP

export const pyodideExample = () => {

const html = `

<!DOCTYPE html>

<html>

<head>

<title>My Pyodide App</title>

</head>

<body>

aqi

@axelav

An interactive, runnable TypeScript val by axelav

0

Cron

export let aqi = async () => {

let res = await fetchJSON(

"https://api.openaq.org/v2/latest?" +

new URLSearchParams({

limit: "10",

page: "1",

coordinates: "40.666758,-73.967150",

offset: "0",

sort: "desc",

radius: "100000",

myspaceHtml

@jdan

An interactive, runnable TypeScript val by jdan

4

0

Script

interface MyspaceProfileArgs {

displayName: string;

info: {

imageUrl: string;

allImagesUrl?: string;

status: string;

gender?: string;

age: number;

location: string[];

lastLogin: string;

headersExample

@koenbok

An interactive, runnable TypeScript val by koenbok

0

Script

export const headersExample = async (request: Request) => {

let url = new URL(request.url);

const targetUrl = url.searchParams.get("url");

// If no 'url' query parameter was provided, return an error message

if (!targetUrl) {

return new Response(JSON.stringify({ error: "Missing URL parameter" }), {

headers: { "Content-Type": "application/json" },

status: 400,

const response = await fetch(targetUrl);

console.log(response);

gitReleaseNotes

@kylem

Github Release Notes from package.json Enter a raw github URL to a package.json, https://raw.githubusercontent.com/username/repo/branch/package.json and get a response of all release notes for all packages from current to latest. Roadmap [ ] GenAI summary [ ] Weekly cron email reports [ ] Send update PRs [ ] Other package managers like PyPi [ ] Formatting/styling [ ] Loading spinner

2 2

7

HTTP

# Github Release Notes from `package.json`

Enter a raw github URL to a package.json,

https://raw.githubusercontent.com/username/repo/branch/package.json

and get a response of all release notes for all packages from current to latest.

## Roadmap

- [ ] GenAI summary

/** @jsxImportSource npm:hono@3/jsx */

interface PackageJson {

dependencies?: Record<string, string>;

devDependencies?: Record<string, string>;

GDI_SSEService

@rozek

This val is part of a series of examples to introduce "val.town" in my computer science course at Stuttgart University of Applied Sciences . The idea is to motivate even first-semester students not to wait but to put their ideas into practice from the very beginning and implement web apps with frontend and backend. It contains a simple HTTP end point which starts sending a countdown from 10 to 0 using "Server-sent Events" (SSE) This val is the companion of https://rozek-gdi_sse.web.val.run/ which contains the browser part (aka "frontend") for this example. The code was initially created using Townie - but this time it required a lot of manual corrections. This val is licensed under the MIT License.

0

HTTP

This val is part of a series of examples to introduce "val.town" in my computer science course at

[Stuttgart University of Applied Sciences](https://www.hft-stuttgart.com/).

The idea is to motivate even first-semester students not to wait but to put their

ideas into practice from the very beginning and implement web apps with

frontend and backend.

It contains a simple HTTP end point which starts sending a countdown from 10 to 0 using "Server-sent

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

// Only handle GET requests

if (req.method !== 'GET') {

return new Response('Method Not Allowed', { status: 405 });