Back to packages list

Vals using preact-render-to-string

Description from the NPM package:
Render JSX to an HTML string, with support for Preact components.
karkowg avatar
fav
@karkowg
HTTP
fav Turn an emoji into an SVG favicon. Inspired by Lea's tweet . Usage <link rel="icon" href="https://karkowg-fav.web.val.run?emoji=🧨" /> Alternatively, you can use Wes Bos' fav.farm .
iamseeley avatar
preactExample
@iamseeley
HTTP
@jsxImportSource https://esm.sh/preact
neverstew avatar
ivoryPorpoise
@neverstew
HTTP
@jsxImportSource https://esm.sh/preact
janpaul123 avatar
valtownsemanticsearch
@janpaul123
HTTP
😎 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!
jxnblk avatar
snake
@jxnblk
HTTP
// WIP turn-based snake game built in Val Town
jxnblk avatar
valTownBadgeExample
@jxnblk
HTTP
Example of how to add a Val Town badge to your val Demo: https://jxnblk-valtownbadgeexample.web.val.run/ Option 1 Wrap your HTTP response handler with https://www.val.town/v/jxnblk/valTownBadgeMiddleware [^1] import wrapper from "https://esm.town/v/jxnblk/valTownBadgeMiddleware"; async function handler(req: Request): Promise<Response> { const html = ` <h1>Hello, world</h1> `; return new Response(html, { headers: { "Content-Type": "text/html; charset=utf-8", }, }); } export default wrapper(handler, import.meta.url); Option 2 Get the HTML string for the badge using https://www.val.town/v/jxnblk/valTownBadge Add the HTML to your response's HTML string wherever you like import valTownBadge from "https://esm.town/v/jxnblk/valTownBadge"; export default async function(req: Request): Promise<Response> { const badge = valTownBadge(import.meta.url); const html = ` <h1>Hello, world</h1> ${badge} `; return new Response(html, { headers: { "Content-Type": "text/html; charset=utf-8", }, }); } Manual options You can also edit the snippet below to manually add the badge in HTML <a href="https://www.val.town/v/jxnblk/valTownBadgeExample" target="_blank" style="text-decoration:none;color:inherit"> <img src="https://jxnblk-valtownbadgesvg.web.val.run/" width="160" height="160"> </a> Or markdown: [![View source on Val Town](https://jxnblk-valtownbadgesvg.web.val.run/)](https://www.val.town/v/jxnblk/valTownBadgeExample) [^1]: Middleware is not recommended when using client-side hydration in apps like React or when returning a full, valid HTML response
emilycoe avatar
ilyBday
@emilycoe
HTTP
@jsxImportSource https://esm.sh/preact
jxnblk avatar
svg_favicon
@jxnblk
HTTP
SVG favicon service, with support for custom text/letters and colors <img src="https://jxnblk-svg_favicon.web.val.run?text=Hi&color=000&bg=f0f" />
stevekrouse avatar
isthegtrainfucked
@stevekrouse
HTTP
@jsxImportSource https://esm.sh/preact
tfayyaz avatar
preactExample
@tfayyaz
HTTP
@jsxImportSource https://esm.sh/preact
pbt avatar
isthegtrainfucked
@pbt
HTTP
@jsxImportSource https://esm.sh/preact
jxnblk avatar
contrast_swatch
@jxnblk
HTTP
@jsxImportSource https://esm.sh/preact
jxnblk avatar
svg_card
@jxnblk
Script
@jsxImportSource https://esm.sh/preact
rayman avatar
HTMXQuill
@rayman
HTTP
@jsxImportSource https://esm.sh/preact
stevekrouse avatar
exponentialBackoffMiddleware
@stevekrouse
Script
Exponential backoff middleware If your server returns a 5xx error, it will wait 1, 2, 4, 8, 16, 32, 64, 128... seconds before retrying Usage import { exponentialBackoffMiddleware } from "https://esm.town/v/stevekrouse/exponentialBackoffMiddleware" export default exponentialBackoffMiddleware(() => { /* your normal http handler * / }) Example usage: https://www.val.town/v/stevekrouse/BIGweather?v=164#L114
pomdtr avatar
indie_auth
@pomdtr
Script
@jsxImportSource npm:preact