Search
val_vdb8oSzkQG
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function val_vdb8oSzkQG(req) {
try {
// Execute the code directly and capture its result

myApi
@cihad
An interactive, runnable TypeScript val by cihad
Script
export function myApi(name) {
return "hi " + name;
blob
@std
Blob Storage - Docs ↗ Val Town comes with blob storage built-in. It allows for storing any data, like text, JSON, or images. You can access it via std/blob . Blob storage is scoped globally to your account. If you set a blob in one val, you can retrieve it by the same key in another val. It's backed by Cloudflare R2. Blob Admin Panels Blob Storage in Settings – built-into Val Town - list, download, delete blobs Blob Admin – search, view, edit, upload blobs – built in a val – easy to customize in Val Town! Usage Get JSON import { blob } from "https://esm.town/v/std/blob";
let blobDemo = await blob.getJSON("myKey");
console.log(blobDemo); // returns `undefined` if not found Set JSON import { blob } from "https://esm.town/v/std/blob";
await blob.setJSON("myKey", { hello: "world" }); List keys import { blob } from "https://esm.town/v/std/blob";
let allKeys = await blob.list();
console.log(allKeys);
const appKeys = await blob.list("app_");
console.log(appKeys); // all keys that begin with `app_` Delete by key import { blob } from "https://esm.town/v/std/blob";
await blob.delete("myKey"); Examples Counter RSS Notifications (saving the last run time) Picture: Save & Read Error Handling blob.get can throw ValTownBlobNotFoundError Any method can throw ValTownBlobError for unexpected errors. Utilities Our Blob SDK also includes some utility functions to make working with blobs easier. Copy import { blob } from "https://esm.town/v/std/blob";
await blob.copy("myKey", "myKeyCopy"); Move import { blob } from "https://esm.town/v/std/blob";
await blob.move("myKey", "myKeyNew"); Lower-level API We provide access to the lower-level getter and setters,
which are useful if you are storing non-JSON or binary data,
need to stream in your response or request data, or do anything else lower-level. async get(key: string) : Retrieves a blob for a given key. async set(key: string, value: string | BodyInit) : Sets the blob value for a given key. See BodyInit . Limitations Blob-stored data counts towards your total Val Town storage – 10mb on the free plan and 1gb on pro. Check our pricing page to learn more. Keys for blobs can be up to 512 characters long. 📝 Edit docs
Script
Our Blob SDK also includes some utility functions to make working with blobs easier.
* Provides functions for interacting with your account's blob storage.
async function list(prefix?: string): Promise<{ key: string; size: number; lastModified: string }[]> {
async function delete_(key: string) {
async function get(key: string) {
async function set(key: string, value: BodyInit) {
async function copy(previous: string, next: string) {
async function move(previous: string, next: string) {
async function getJSON<T = unknown>(key: string): Promise<T> {
async function setJSON(key: string, value: any) {
valle_tmp_463480496454860730332801536131093
@janpaul123
// This updated val serves an HTML page emulating a Hacker News clone.
HTTP
// This updated val serves an HTML page emulating a Hacker News clone.
// It now has clickable titles that will serve pages with some fake story content.
export default async function(req: Request): Promise<Response> {
const url = new URL(req.url);
const path = url.pathname;
valle_tmp_397893855838237934336717990875854
@janpaul123
// This HTTP val responds to all requests with "Hello world"
HTTP
// This HTTP val responds to all requests with "Hello world"
export default async function main(req: Request): Promise<Response> {
return new Response("Hello world", { headers: { "Content-Type": "text/plain" } });

eventsInNYC
@vawogbemi
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
function EventSubmissionForm({ onSubmit }) {
const [formData, setFormData] = useState({
</form>
function About() {
return (
</div>
function SubscribePopup({ onSubscribe, onClose }) {
const [email, setEmail] = useState('');
</div>
function SubscribeIcon({ onClick }) {
return (
</div>
function HighwaySign() {
return (
</div>
function App() {
const [showSubscribe, setShowSubscribe] = 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");

getMe
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Script
import { fetchJSON } from "https://esm.town/v/stevekrouse/fetchJSON";
export function getMe(): Promise<{ username: string; id: string; profileImageUrl; bio: string }> {
return fetchJSON("https://api.val.town/v1/me", {
headers: {
hostResume
@iamseeley
An interactive, runnable TypeScript val by iamseeley
Script
export async function hostResume(jsonResume, apiKey) {
const userDetailsEndpoint = 'https://api.val.town/v1/me/';
const createValEndpoint = 'https://api.val.town/v1/vals/';
'Content-Type': 'application/json'
body: JSON.stringify({
code: `export default async function handler(req: Request): Promise<Response> {
const resumeJSON = ${JSON.stringify(jsonResume, null, 2)};
const resume = JSON.stringify(resumeJSON);
myApi
@billbak
An interactive, runnable TypeScript val by billbak
Script
export function myApi(name) {
return "hi " + name;

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

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

nowCastPMAQI
@stungeye
// Forked from @stevekrouse.nowCastPMAQI
Script
import { msHour } from "https://esm.town/v/stevekrouse/msHour?v=1";
import { fetchJSON } from "https://esm.town/v/stevekrouse/fetchJSON?v=41";
export async function nowCastPMAQI({ location_id }) {
const { results } = await fetchJSON(
"https://api.openaq.org/v2/measurements?" +

dateme_notion_sync
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Cron
import { dateMeNotionDatabase } from "https://esm.town/v/stevekrouse/dateMeNotionDatabase";
function jsonifyDoc(doc) {
return Object.fromEntries(
([key, value]) => [key, key === "Age" ? value : JSON.stringify(value)],
function sqlifyDoc(doc) {
let keys = Object.keys(doc);
args: doc,
export default async function sync_dateme_docs() {
await sqlite.execute("delete from DateMeDocs");
GDI_AIChatCompletion
@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 web page which allows users to enter a "System Message" and
a "User Message" in order to be sent to a preconfigured server. That server then
runs a chat completion and returns the computed "Assistant Message" back to the
client where the result is presented to the user. This val is the companion of https://rozek-gdi_aichatcompletionservice.web.val.run/ which contains the server part (aka "backend") for this example. The code was created using Townie - with only a few small manual corrections. This val is licensed under the MIT License.
HTTP
import { createRoot } from "https://esm.sh/react-dom/client";
function App() {
const [systemMessage, setSystemMessage] = useState("You are a helpful assistant");
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
client();
export default async function server(request: Request): Promise<Response> {
return new Response(

r2
@stevekrouse
r2 wrapper Save blobs without leaving Val Town! Only for Val Town Pro users to limit abuse. We get 10gb free, so as long as nobody abuses this, I won't put any strict limits on it. If you want to use more than 10gb, let me know, and we can bill you for it. All data in this bucket is public if you know it's name! This val, @stevekrouse.r2, is the "SDK" for @stevekrouse.r2Proxy . Setup This val requires you to setup public key auth, which is really just three clicks here: https://blog.val.town/public-key-auth-val-town-users-can-be-your-users [Optional] You can setup a helper function so you don't have to pass your keys every time: let blob = (key, value) => @stevekrouse.r2(key, value, @me.exportedKeys) Warning: Do not make your blob function public or unlisted. That would allow anyone to use it. Usage await @me.blob("demo", { hello: "world" });
return @me.blob("demo"); // {hello: "world"} Example usage: https://www.val.town/v/stevekrouse.r2Demo
Script
1. This val requires you to setup public key auth, which is really just three clicks here: https://blog.val.town/public-key-auth-val-town-users-can-be-your-users
2. [Optional] You can setup a helper function so you don't have to pass your keys every time:
```js
let blob = (key, value) => @stevekrouse.r2(key, value, @me.exportedKeys)
Warning: Do **not** make your blob function public or unlisted. That would allow anyone to use it.
## Usage
import { whoami } from "https://esm.town/v/stevekrouse/whoami";
export async function r2(key, value?, keys?) {
// GET