Search

blog_test_25_1_11

@arfan

@jsxImportSource https://esm.sh/react@18.2.0

HTTP

date: string;

function App() {

const [posts, setPosts] = useState<BlogPost[]>([]);

</div>

function Sidebar({ posts, onSelectPost, onNewPost }: {

posts: BlogPost[];

</nav>

function HomePage({ posts }: { posts: BlogPost[] }) {

return (

</div>

function BlogPost({ post, onEdit }: { post: BlogPost; onEdit: () => void }) {

useEffect(() => {

</div>

function PostForm({ post, onSubmit, onClose }: {

post?: BlogPost;

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

client();

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

const { blob } = await import("https://esm.town/v/std/blob");

function copyToClipboard(text) {

navigator.clipboard.writeText(text).then(() => {

semanticSearchBlogPostPlot

@janpaul123

An interactive, runnable TypeScript val by janpaul123

HTTP

import blogPostEmbeddingsDimensionalityReduction from "https://esm.town/v/janpaul123/blogPostEmbeddingsDimensionalityReductio

export async function semanticSearchBlogPostPlot() {

const Plot = await import("https://cdn.jsdelivr.net/npm/@observablehq/plot@0.6.14/+esm");

const d3 = await import("https://cdn.jsdelivr.net/npm/d3@7/+esm");

emailRandomJoke

@goofygabe

// 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",

InvocationTracker_Test

@rozek

Here are some tests for val InvocationTracker Test Cases Constructor test with valid inputs tests creating a new InvocationTracker instance with valid name and granularity Constructor test with invalid name verifies that creating an InvocationTracker with an invalid name throws an error Constructor test existing table verifies that creating an InvocationTracker with an already existing table does not modify that table Granularity method test checks if the Granularity() method returns the correct initial granularity value setGranularity method test tests setting a new granularity value and verifies it's updated correctly increment method test verifies that the increment() method correctly increases the invocation count InvocationsInSpan method test tests retrieving invocations within a specific time span, including multiple time periods totalInvocationsInSpan method test checks if the total number of invocations within a given time span is calculated correctly reset method test verifies that the reset() method clears all recorded invocations

HTTP

import { sqlite } from 'https://esm.town/v/stevekrouse/sqlite'

import { InvocationTracker } from 'https://esm.town/v/rozek/InvocationTracker'

export default async function () {

const TestCases = [

/**** test constructor with valid inputs ****/

console.log('"reset" method test passed')

/**** removeTable ****/

async function removeTable (TableName:string):Promise<void> {

console.log('(cleaning up)')

await sqlite.execute(

getDuckDB

@tmcw

Get a DuckDB database This method sets up a duckdb-wasm database that you can then use to store and retrieve data.

1 1 5

Script

import { fetch } from "https://esm.town/v/std/fetch";

export let getDuckDB = (async () => {

async function createWorker(url: string) {

const workerScript = await fetch(url);

const workerURL = URL.createObjectURL(await workerScript.blob());

scientificCalculatorApp

@Adool55

@jsxImportSource https://esm.sh/react@18.2.0

HTTP

import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";

function ScientificCalculator() {

const [display, setDisplay] = useState("0");

</div>

function App() {

return (

</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(`

animateElement

@iamseeley

An interactive, runnable TypeScript val by iamseeley

Script

export function animateElement(element, delay) {

return new Promise(resolve => {

setTimeout(() => {

resolve();

}, delay);

export async function animateElementsSimultaneously(elements, initialDelay) {

const promises = elements.map(element => animateElement(element, initialDelay));

await Promise.all(promises);

viewSource

@neverstew

View source code Just like a right click + inspect on desktop, except available on mobile too! Just write the website after the / e.g. https://neverstew-viewSource.web.val.run/bbc.co.uk

2 1

HTTP

import { fetchText } from "https://esm.town/v/stevekrouse/fetchText?v=6";

import { escape } from "npm:html-sloppy-escaper";

export default async function viewSource(req: Request) {

const pathname = new URL(req.url).pathname;

const html = await fetchText(pathname === "/" ? "example.com" : pathname).then(prettifyHtml);

valentine

@risha_narayanan

Hello!!! Forked this val from mewtru...had a lot of fun testing my fun React knowledge with this one :)

HTTP

"I already made couple costumes for Halloween... 🎃🥺",

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(

YouTubeSubmissions

@mvmattgray

// This approach uses HTML for the form and Blob storage for persistence.

HTTP

import { blob } from "https://esm.town/v/std/blob";

const KEY = new URL(import.meta.url).pathname;

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

const url = new URL(req.url);

// API endpoints for Framer Fetch

ankiNudge

@petermillspaugh

An interactive, runnable TypeScript val by petermillspaugh

Cron

import { email } from "https://esm.town/v/std/email?v=9";

export async function ankiNudge() {

const today = new Date();

const todayDate = new Intl.DateTimeFormat("en-US", { dateStyle: "long" })

capturePostHogEvent

@ianvph

An interactive, runnable TypeScript val by ianvph

Script

export async function capturePostHogEvent(

key: string,

distinct_id: string,

secureBlueTortoise

@mohsen

An interactive, runnable TypeScript val by mohsen

export default async function (e: Email) {

sailingNotifyCron

@chet

An interactive, runnable TypeScript val by chet

Cron

import { email } from "https://esm.town/v/std/email";

import process from "node:process";

export async function sailingNotifyCron({ lastRunAt }) {

const result = await sailingNotify("Fair Oaks, CA", 10);

aqi

@mulitu

AQI Alerts Get email alerts when AQI is unhealthy near you. Set up Click Fork Change location (Line 4) to describe your location. It accepts fairly flexible English descriptions which it turns into locations via nominatim's geocoder API . Click Run Background This val uses nominatim's geocoder to get your lat, lon, and air quality data from OpenAQ. It uses EPA's NowCast AQI Index calculation and severity levels. Learn more: https://www.val.town/v/stevekrouse.easyAQI

Cron

import { email } from "https://esm.town/v/std/email?v=9";

import { easyAQI } from "https://esm.town/v/stevekrouse/easyAQI?v=5";

export async function aqi(interval: Interval) {

const location = "nairobi kenya"; // <-- change to place, city, or zip code

const data = await easyAQI({ location });

…

207 208

209

210 211

…

466