Search

valboard

@avycado13

// Function to fetch JSON data from URL

HTTP (deprecated)

import renderToString from "https://esm.sh/preact-render-to-string@6.2.1";

import { h } from "https://esm.sh/preact@10.23.2";

// Function to fetch JSON data from URL

text: item.Text,

// Server-side rendering

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

REACT_DOM_CDN_VAL

@liamdanielduffy

An interactive, runnable TypeScript val by liamdanielduffy

Script

import { REACT_DOM_MINIFIED_FINAL } from "https://esm.town/v/liamdanielduffy/REACT_DOM_MINIFIED_FINAL";

export function REACT_DOM_CDN_VAL(req, res) {

res.set("Content-Type", "text/javascript");

res.send(REACT_DOM_MINIFIED_FINAL);

MoonPhase

@sethblanchard

@jsxImportSource npm:react

HTTP (deprecated)

/** @jsxImportSource npm:react **/

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

import { load } from "npm:cheerio";

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

export default async (req: Request) => {

const html = await fetchText(

VALLErun

@stevekrouse

The actual code for VALL-E: https://www.val.town/v/janpaul123/VALLE

HTTP (deprecated)

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

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

import _ from "npm:lodash@4";

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

// Set these to your own

const systemprompt = `All the above are example conversations and context you can refer to, but don't

consider it part of the current conversation. The conversation below is your recent interaction with the user.

Your entire response should only be TypeScript.

staticChess

@rickygrassmuck

Static Chess Check it out here: https://chess.maxmcd.com Plain, brutalist, no bloat chess. Every page is only html and css. Every chess move is made by clicking a link. Send a link to your friend and they'll send you one back to make your move. No silly animations or slick interactivity to trip up your gameplay. When Google indexes this site will we successfully compute all possible chess moves? Functionality is quite limited, and things might be broken. Please let me know if you find bugs! Inspired by this HN discussion about sites that have all possible game states of tic-tac-toe. I plan on extending this to support real gameplay. I think it could be a nice simple interface for long form games with friends. Might also be fun to add a static AI to play against. Feel free to PR any changes if you'd like to see something added.

HTTP (deprecated)

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

import { Chess, Move, Square } from "npm:chess.js";

import minify from "npm:css-simple-minifier";

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

class StaticChess {

size = 8;

coralCarp

@willthereader

ChatGPT Implemented in Val Town Demonstrated how to use assistants and threads with the OpenAI SDK and how to stream the response with Server-Sent Events

HTTP (deprecated)

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

import OpenAI from "npm:openai";

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

const openai = new OpenAI();

return new Response(renderToString(jsx), { headers: { "Content-Type": "text/html" } });

const clientCode = () => {

document.getElementById("input").addEventListener("submit", function(event) {

</form>

</script>

VALLErun

@roadlabs

The actual code for VALL-E: https://www.val.town/v/janpaul123/VALLE

HTTP (deprecated)

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

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

import _ from "npm:lodash@4";

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

export default function(

const systemprompt = `All the above are example conversations and context you can refer to, but don't

consider it part of the current conversation. The conversation below is your recent interaction with the user.

Your entire response should only be TypeScript.

VALLErun

@mharris717

The actual code for VALL-E: https://www.val.town/v/janpaul123/VALLE

HTTP (deprecated)

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

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

import _ from "npm:lodash@4";

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

// Set these to your own

const systemprompt = `All the above are example conversations and context you can refer to, but don't

consider it part of the current conversation. The conversation below is your recent interaction with the user.

Your entire response should only be TypeScript.

valTownChatGPT

@simonw

ChatGPT Implemented in Val Town Demonstrated how to use assistants and threads with the OpenAI SDK and how to stream the response with Server-Sent Events.

HTTP (deprecated)

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

import OpenAI from "npm:openai";

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

// This uses by personal API key, you'll need to provide your own if

return new Response(renderToString(jsx), { headers: { "Content-Type": "text/html" } });

const clientCode = () => {

document.getElementById("input").addEventListener("submit", async function(event) {

</form>

</script>

lucia_middleware

@yawnxyz

Lucia Middleware Import users. Backed by Val Town SQLite. Demo: @stevekrouse/lucia_middleware_demo If you want a version that is safe to import (but not call) on the frontend: import { luciaMiddleware } from "https://esm.town/v/stevekrouse/lucia_middleware_safe"; Usage Wrap your HTTP handler in it, ie export default luciaMiddleware(handler) In your handler, redirect to /auth/signup , /auth/login , /auth/logout to trigger those flows. Remember Response.redirect is broken in Val Town right now, so either use links or return new Response(null, { 302, headers: { Location: "/place/to/redirect" }}) In your HTTP handler, read the X-Lucia-Username header, ie const username = req.headers.get("X-Lucia-Username") If the user is logged in, you now have a username you can work with. If not, it will be empty Custom Sign Up and Log In pages By default, the middleware has very basic sign in and sign up pages. The only way to customize those right now is to fork this middleware and customize them to your liking. Todos [ ] Allow users to specify the users & sessions table [ ] Remove Hono from this middleware (attempted in this fork: @stevekrouse/lucia_middleware_vanilla) [ ] Allow users to customize the auth pages without forking the middleware Initially built by @pomdtr

Script

import { serializeCookie, parseCookies } from "npm:oslo/cookie";

const githubClientId = Deno.env.get("GITHUB_OAUTH_COVERSHEET_CLIENT");

const githubClientSecret = Deno.env.get("GITHUB_OAUTH_COVERSHEET_SECRET");

export const github = new GitHub(githubClientId, githubClientSecret);

const googleClientId = Deno.env.get("GOOGLE_OAUTH_COVERSHEET_CLIENT");

const googleClientSecret = Deno.env.get("GOOGLE_OAUTH_COVERSHEET_SECRET");

const google = new Google(googleClientId, googleClientSecret, `https://yawnxyz-hncloneluciaoauth.web.val.run/auth/google/call

// TODO: need to be able to set these dynamically from the requester app

greenSilkworm

@atlted

@jsxImportSource npm:react

HTTP (deprecated)

/** @jsxImportSource npm:react **/

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

export default (req: Request) => {

return new Response(

MacTrackpadScale

@perbhat

@jsxImportSource npm:react

HTTP (deprecated)

/** @jsxImportSource npm:react **/

import { useEffect, useState } from "npm:react";

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

const TrackpadScale = () => {

linkInBioTemplate

@AP123

@jsxImportSource https://esm.sh/react

HTTP (deprecated)

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

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

export default async function(req: Request) {

return new Response(

reactExample

@maxm

@jsxImportSource https://esm.sh/react

HTTP (deprecated)

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

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

export const reactExample = () =>

new Response(renderToString(<div>Test {1 + 1}</div>), {

azureCheetah

@tmcw

The actual code for VALL-E: https://www.val.town/v/janpaul123/VALLE

HTTP (deprecated)

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

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

import _ from "npm:lodash@4";

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

export default function(

const systemprompt = `All the above are example conversations and context you can refer to, but don't

consider it part of the current conversation. The conversation below is your recent interaction with the user.

Your entire response should only be TypeScript.

…

31 32

34 35

…

184