Search
![pomdtr avatar](https://images.clerk.dev/oauth_github/img_2RCoAITJZH1QencEgtVjh4Qirj4.jpeg)
ninja_keys
@pomdtr
GET https://pomdtr-ninja_keys.web.val.run
HTTP
```http
GET https://pomdtr-ninja_keys.web.val.run
/** @jsxImportSource npm:hono@3.12.8/jsx **/
const app = new Hono();
app.get("/", (c) => {
return c.html(
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
hono
@RIKKAEBI
An interactive, runnable TypeScript val by RIKKAEBI
HTTP
import { Hono } from "npm:hono@4.0.0";
const app = new Hono();
app.get("/", (c) => c.text("hello world!"));
export default app.fetch;
hackernewstopstory
@tmcw
Something
HTTP
Something
/** @jsxImportSource npm:hono@3/jsx */
const app = new Hono()
app.get("/", async (c) => {
const response = await fetch("https://hacker-news.firebaseio.com/v0/topstories.json")
const storyIds = await response.json()
const storyResponse = await fetch(`https://hacker-news.firebaseio.com/v0/item/${storyIds[0]}.json`)
const story = await storyResponse.json()
return c.html(
<div>
spinner
@iamseeley
@jsxImportSource npm:hono@3/jsx
HTTP
/** @jsxImportSource npm:hono@3/jsx */
const app = new Hono();
const createMainPage = () => (
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
body, html {
margin: 0;
sqliteExplorerApp
@nbbaier
SQLite Explorer View and interact with your Val Town SQLite data. It's based off Steve's excellent SQLite Admin val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by LibSQL Studio by invisal . This is now more an SPA, with tables, queries and results showing up on the same page. Install Install the latest stable version (v86) by forking this val: Authentication Login to your SQLite Explorer with password authentication with your Val Town API Token as the password. Todos / Plans [ ] improve error handling [ ] improve table formatting [ ] sticky table headers [x] add codemirror [ ] add loading indication to the run button (initial version shipped) [ ] add ability to favorite queries [ ] add saving of last query run for a table (started) [ ] add visible output for non-query statements [ ] add schema viewing [ ] add refresh to table list sidebar after CREATE/DROP/ALTER statements [ ] add automatic execution of initial select query on double click [x] add views to the sidebar [ ] add triggers to sidebar [ ] add upload from SQL, CSV and JSON [ ] add ability to connect to a non-val town Turso database [x] fix wonky sidebar separator height problem (thanks to @stevekrouse) [x] make result tables scrollable [x] add export to CSV, and JSON (CSV and JSON helper functions written in this val . Thanks to @pomdtr for merging the initial version!) [x] add listener for cmd+enter to submit query
HTTP
# SQLite Explorer
View and interact with your Val Town SQLite data. It's based off Steve's excellent [SQLite Admin](https://www.val.town/v/stevekrouse/sqlite_admin?v=46) val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by [LibSQL Studio](https://github.com/invisal/libsql-studio) by [invisal](https://github.com/invisal). This is now more an SPA, with tables, queries and results showing up on the same page.
![image.webp](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/c8e102fd-39ca-4bfb-372a-8d36daf43900/public)
## Install
Install the latest stable version (v86) by forking this val:
[![Install Stable Release (v86)](https://stevekrouse-button.express.val.run/Install%20Stable%20Release%20(v81))](https://www.val.town/v/nbbaier/sqlite_explorer/fork)
/** @jsxImportSource https://esm.sh/hono@latest/jsx **/
EditorSection,
MockTable,
Separator,
tiptapEditorExample
@nbbaier
@jsxImportSource https://esm.sh/preact
HTTP
/** @jsxImportSource https://esm.sh/preact */
export default async function(req: Request) {
return new Response(
render(
<html>
<head>
<title>Title</title>
<style>{`${tiptapStyle}`}</style>
</head>
<body>
valleGetValsContextWindow
@janpaul123
An interactive, runnable TypeScript val by janpaul123
Script
const cacheBlobKey = "getValsContextWindowCache3";
export default async function getValsContextWindow(model: any) {
const fullCacheBlobKey = `${cacheBlobKey}-${model}`;
const cached = await blob.getJSON(fullCacheBlobKey);
if (cached) {
return cached;
const readmeVals: any = await (await fetch("https://janpaul123-readmevals.web.val.run/")).json();
const API_URL = "https://api.val.town";
const sections = [
name: "Imports",
![pomdtr avatar](https://images.clerk.dev/oauth_github/img_2RCoAITJZH1QencEgtVjh4Qirj4.jpeg)
hackernews_cmdk
@pomdtr
An interactive, runnable TypeScript val by pomdtr
HTTP
const app = new Hono();
app.get("/", (c) => {
return c.json({
type: "list",
list: {
items: [
title: "Search Front Page",
actions: [
type: "push",
push: {
tealEarthworm
@nbbaier
@jsxImportSource npm:hono/jsx
HTTP
/** @jsxImportSource npm:hono/jsx */
const app = new Hono();
const StyleTag: FC = ({ css }) => <style dangerouslySetInnerHTML={{ __html: css }}>{}</style>;
const css = `body {
font-family: system-ui, sans-serif;
button {
border-radius: .5em;
padding: .25em;
font-size: 1.5em;
line-height: 1;
![stevekrouse avatar](https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg)
npmDefaultErrorExample
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Script
export const npmDefaultErrorExample = (async () => {
const _ = await import("npm:lodash");
return _.partition([1, 2, 3, 4], (n) => n % 2);
projects
@willthereader
@jsxImportSource https://esm.sh/hono@latest/jsx
HTTP
/** @jsxImportSource https://esm.sh/hono@latest/jsx **/
export const projects = (c: Context) => {
return c.html(
<html>
<head>
<title>Projects</title>
<style
dangerouslySetInnerHTML={{
__html:
`:root{--slate1: hsl(200, 7%, 8.8%);--slate2: hsl(195, 7.1%, 11%);--slate3: hsl(197, 6.8%, 13.6%);--slate4: hsl(198, 6.6%, 15.8%);--slate5: hsl(199, 6.4%, 17.9%);--slate6: hsl(201, 6.2%, 20.5%);--slate7: hsl(203, 6%, 24.3%);--slate8: hsl(207, 5.6%, 31.6%);--slate9: hsl(206, 6%, 43.9%);--slate10: hsl(206, 5.2%, 49.5%);--slate11: hsl(206, 6%, 63%);--slate12: hsl(210, 6%, 93%);--blue1: hsl(212, 35%, 9.2%);--blue2: hsl(216, 50%, 11.8%);--blue3: hsl(214, 59.4%, 15.3%);--blue4: hsl(214, 65.8%, 17.9%);--blue5: hsl(213, 71.2%, 20.2%);--blue6: hsl(212, 77.4%, 23.1%);--blue7: hsl(211, 85.1%, 27.4%);--blue8: hsl(211, 89.7%, 34.1%);--blue9: hsl(206, 100%, 50%);--blue10: hsl(209, 100%, 60.6%);--blue11: hsl(210, 100%, 66.1%);--blue12: hsl(206, 98%, 95.8%)}body{font-family:system-ui,sans-serif;margin:auto;padding:20px;max-width:65ch;text-align:left;word-wrap:break-word;overflow-wrap:break-word;line-height:1.5}h1,h2,h3,h4,h5,h6,strong,b{font-weight:500}a{color:var(--blue10)}nav a{margin-right:10px}textarea{width:100%;font-size:16px}input{font-size:16px}content{line-height:1.6}table{width:100%}img{max-width:100%;height:auto}code{padding:2px 5px;background-color:var(--slate4);font-family:menlo,monospace}pre{padding:1rem}pre>code{all:unset}blockquote{border:1px solid var(--slate10);color:var(--slate11);padding:2px 0 2px 20px;margin:0;font-style:italic}a[data-astro-cid-eimmu3lg]{display:inline-block;text-decoration:none}a[data-astro-cid-eimmu3lg].active{font-weight:600;text-decoration:underline}header[data-astro-cid-3ef6ksr2]{margin:0 0 2em}h2[data-astro-cid-3ef6ksr2]{margin:.5em 0}`,
hello_cli
@jxnblk
Example CLI hosted on Val Town Install with Deno on your computer (name it whatever you want): deno install -n hello https://esm.town/v/jxnblk/hello_cli Run: hello Uninstall: deno uninstall hello Read the deno install docs
Script
Example CLI hosted on Val Town
Install with Deno on your computer (name it whatever you want):
```sh
deno install -n hello https://esm.town/v/jxnblk/hello_cli
Run:
```sh
// deno install -n hello https://esm.town/v/jxnblk/hello_cli
export default function main() {
const name = Deno.args[0] || "";
console.log(`hello ${name}`);
![stevekrouse avatar](https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg)
npmDefaultExample
@stevekrouse
An interactive, runnable TypeScript val by stevekrouse
Script
export const npmDefaultExample = (async () => {
const { default: _ } = await import("npm:lodash");
return _.partition([1, 2, 3, 4], (n) => n % 2);
scarletSole
@tempdev
An interactive, runnable TypeScript val by tempdev
HTTP
interface Context {
url: string;
const app = new Hono();
app.get("/dood/:dood", async (c) => {
const { dood } = c.req.param();
const ctx = { url: "https://d000d.com/e/" + dood };
return c.json(await doodstream(ctx));
app.get("/tape/:tape", async (c) => {
const { tape } = c.req.param();
const ctx = { url: "https://streamtape.com/e/" + tape };
gitReleaseNotes
@kylem
Github Release Notes from package.json Enter a raw github URL to a package.json, https://raw.githubusercontent.com/username/repo/branch/package.json and get a response of all release notes for all packages from current to latest. Roadmap [ ] GenAI summary [ ] Weekly cron email reports [ ] Send update PRs [ ] Other package managers like PyPi [ ] Formatting/styling [ ] Loading spinner
HTTP
# Github Release Notes from `package.json`
Enter a raw github URL to a package.json,
https://raw.githubusercontent.com/username/repo/branch/package.json
and get a response of all release notes for all packages from current to latest.
## Roadmap
- [ ] GenAI summary
/** @jsxImportSource npm:hono@3/jsx */
interface PackageJson {
dependencies?: Record<string, string>;
devDependencies?: Record<string, string>;