Search

ethicalLimeGopher

@mohamde12m

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

HTTP

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

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

export default (req: Request) => {

return new Response(

grayMinnow

@justinenerio

@jsxImportSource npm:react

HTTP

/** @jsxImportSource npm:react **/

import { renderToString } from "npm:react-dom@18/server";

export default (req: Request) => {

return new Response(

valle_tmp_605448986086057210791953389018616

@janpaul123

@jsxImportSource https://esm.sh/react

HTTP

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

import valleGetValsContextWindow from "https://esm.town/v/janpaul123/valleGetValsContextWindow";

import archiveVal from "https://esm.town/v/nbbaier/archiveVal?v=10";

import _ from "npm:lodash@4";

import OpenAI from "npm:openai";

import { renderToString } from "npm:react-dom/server";

// Set these to your own

const username = "janpaul123";

REACT_TODO_LIST_CONTENTS

@liamdanielduffy

// https://api.val.town/v1/express/liamdanielduffy.reactTodoListWebsite

Script

// https://api.val.town/v1/express/liamdanielduffy.reactTodoListWebsite

export const REACT_TODO_LIST_CONTENTS = {

body: `<div id="root"></div>

const e = React.createElement;

class TodoList extends React.Component {

constructor(props) {

text: ''

ReactDOM.render(

e(TodoList),

perceptiveIndigoBeaver

@vahe

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

HTTP

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

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

export default (req: Request) => {

var date = new Date(Date.now());

myspace

@stevekrouse

Create your own Myspace profile, deployed to Val town. https://jdan-myspace.web.val.run Click "..." and select Fork to create your own. From there you can: Customize your own profile Or post on my wall by appending to messages and sending me a pull request

HTTP

"Middletown High School South",

"Middletown, NEW JERSEY",

"President: Computer Club",

start: "2006",

end: "2010",

blockchainEcosystemBubbleMap

@juansebsol

@jsxImportSource https://esm.sh/react

HTTP

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

import * as d3 from "https://esm.sh/d3@7";

import { AnimatePresence, motion } from "https://esm.sh/framer-motion@10.12.16";

import React, { useCallback, useEffect, useMemo, useRef, useState } from "https://esm.sh/react";

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

// Fetch all data from DeFi Llama API

</div>

const FloatingMenu = React.memo(({ setFilter, setMinTVL, setMinAPY, setRiskFilter, isOpen, toggleMenu }) => {

const [showAllChains, setShowAllChains] = 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> {

valle_tmp_60836902668989675457109372512279

@janpaul123

@jsxImportSource https://esm.sh/react

HTTP

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

import valleGetValsContextWindow from "https://esm.town/v/janpaul123/valleGetValsContextWindow";

import archiveVal from "https://esm.town/v/nbbaier/archiveVal?v=10";

import _ from "npm:lodash@4";

import OpenAI from "npm:openai";

import { renderToString } from "npm:react-dom/server";

// Set these to your own

const username = "janpaul123";

effortlessAquamarineHookworm

@nsafouane

@jsxImportSource https://esm.sh/react

HTTP

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

import React, { useState, useEffect } from "https://esm.sh/react";

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

function ThemeToggle({ isDarkMode, toggleTheme }) {

</div>

function client() {

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

if (typeof document !== "undefined") { client(); }

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

userspaceAuth

@maxm

@jsxImportSource https://esm.sh/preact

HTTP

/** @jsxImportSource https://esm.sh/preact */

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

// import * as opaque from "npm:@cloudflare/opaque-ts";

import { Hono } from "npm:hono@3";

import { render } from "npm:preact-render-to-string";

const resp = (content, status) =>

new Response(render(content), {

valtownsemanticsearch

@janpaul123

😎 VAL VIBES: Val Town Semantic Search This val hosts an HTTP server that lets you search all vals based on vibes. If you search for "discord bot" it shows all vals that have "discord bot" vibes. It does this by comparing embeddings from OpenAI generated for the code of all public vals, to an embedding of your search query. This is an experiment to see if and how we want to incorporate semantic search in the actual Val Town search page. I implemented three backends, which you can switch between in the search UI. Check out these vals for details on their implementation. Neon: storing and searching embeddings using the pg_vector extension in Neon's Postgres database. Searching: janpaul123/semanticSearchNeon Indexing: janpaul123/indexValsNeon Blobs: storing embeddings in Val Town's standard blob storage , and iterating through all of them to compute distance. Slow and terrible, but it works! Searching: janpaul123/semanticSearchBlobs Indexing: janpaul123/indexValsBlobs Turso: storing and searching using the sqlite-vss extension. Abandoned because of a bug in Turso's implementation. Searching: janpaul123/semanticSearchTurso Indexing: janpaul123/indexValsTurso All implementations use the database of public vals , made by Achille Lacoin , which is refreshed every hour. The Neon implementation updates every 10 minutes, and the other ones are not updated. I also forked Achille's search UI for this val. Please share any feedback and suggestions, and feel free to fork our vals to improve them. This is a playground for semantic search before we implement it in the product for real!

HTTP

/** @jsxImportSource npm:preact **/

import codeOnValTown from "https://esm.town/v/andreterron/codeOnValTown?v=50";

import semanticSearchBlobs from "https://esm.town/v/janpaul123/semanticSearchBlobs";

import semanticSearchNeon from "https://esm.town/v/janpaul123/semanticSearchNeon";

import semanticSearchTurso from "https://esm.town/v/janpaul123/semanticSearchTurso";

import { render } from "npm:preact-render-to-string";

const githubQuery = (query: string) => encodeURIComponent(`${query} repo:pomdtr/val-town-mirror path:vals/`);

async function handler(req: Request) {

@saolsen

P5 sketch Easily turn a p5.js sketch into a val. See https://www.val.town/v/saolsen/p5_sketch for an example. Usage Make a p5 sketch, you can import the p5 types to make it easier. import type * as p5 from "npm:@types/p5"; Export any "global" p5 functions. These are functions like setup and draw that p5 will call. Set the val type to http and default export the result of sketch , passing in import.meta.url . A full example looks like this. import type * as p5 from "npm:@types/p5"; export function setup() { createCanvas(400, 400); } export function draw() { if (mouseIsPressed) { fill(0); } else { fill(255); } ellipse(mouseX, mouseY, 80, 80); } import { sketch } from "https://esm.town/v/saolsen/p5"; export default sketch(import.meta.url); How it works The sketch function returns an http handler that sets up a basic page with p5.js added. It then imports your module from the browser and wires up all the exports so p5.js can see them. All the code in your val will run in the browser (except for the default sketch export) so you can't call any Deno functions, environment variables, or other server side apis.

2 2

Script

## How it works

so you can't call any Deno functions, environment variables, or other server side apis.

travelSurveyApp

@ntontischris

@jsxImportSource https://esm.sh/react

HTTP

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

import React, { useState, useEffect, useRef } from "https://esm.sh/react";

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

const ENGAGEMENT_LEVELS = {

</div>

function client() {

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

if (typeof document !== "undefined") { client(); }

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

fruitLearningGame

@portentouus

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

HTTP

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

import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";

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

const fruits = [

</div>

function client() {

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

if (typeof document !== "undefined") { client(); }

export default async function server(request: Request) {

pleasantMagentaAnglerfish

@btwiuse

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

HTTP

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

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

export default (req: Request) => {

return new Response(

…

66 67

69 70

…

252