Readme

Val Shot

Generate val source code screenshot using sourcecodeshots.com

⚠️ This service is offered for personal use under a reasonable usage policy as stated here: https://sourcecodeshots.com/docs

📣 Special thanks to @pomdtr for their help and contributions!

Usage

https://vladimyr-valshot.web.val.run/v/<author>/<val>

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
// SPDX-License-Identifier: 0BSD
import { fetchVal } from "https://esm.town/v/vladimyr/fetchVal";
import { serveReadme } from "https://esm.town/v/vladimyr/serveReadme";
import { toHonoHandler } from "https://esm.town/v/vladimyr/toHonoHandler";
import { Hono } from "npm:hono";
import ky from "npm:ky";
const router = new Hono();
router.get("/", toHonoHandler(serveReadme(import.meta.url)));
router.get("/v/:author/:name", async (c) => {
const { author, name } = c.req.param();
const query = c.req.query();
const { code } = await fetchVal(author, name);
const imageURL = await createScreenshot(code, query.theme);
return c.redirect(imageURL.href);
});
export default router.fetch;
export async function createScreenshot(code: string, theme: string = "dark-plus"): Promise<URL> {
const apiUrl = "https://sourcecodeshots.com/api/image/permalink";
const { url } = await ky.post(apiUrl, {
json: {
code,
settings: { language: "tsx", theme },
},
}).json();
return new URL(url);
}
👆 This is a val. Vals are TypeScript snippets of code, written in the browser and run on our servers. Create scheduled functions, email yourself, and persist small pieces of data — all from the browser.