Search
![emohamed avatar](https://images.clerk.dev/oauth_github/img_2RGziGLxWr0K1gM0vv14XBYrNLi.jpeg)
myApi
@emohamed
An interactive, runnable TypeScript val by emohamed
Script
export function myApi(name) {
return "hi " + name;
![rodrigotello avatar](https://images.clerk.dev/uploaded/img_2Q1sy7hYih37Ssro2ac4uxgyWtH.png)
myApi
@rodrigotello
An interactive, runnable TypeScript val by rodrigotello
Script
export function myApi(name) {
return "hi " + name;
![dotangad avatar](https://images.clerk.dev/oauth_github/img_2RQvgSkKOs4jr5ym26y0b06sgHo.jpeg)
myApi
@dotangad
An interactive, runnable TypeScript val by dotangad
Script
export function myApi(name) {
return "hi " + name;
![tech_aly avatar](https://images.clerk.dev/oauth_github/img_2SgUPlYPurPhQKmktZbf7yT2dsI.png)
myApi
@tech_aly
An interactive, runnable TypeScript val by tech_aly
Script
export function myApi(name) {
return "hi " + name;
![bacondotbuild avatar](https://images.clerk.dev/oauth_github/img_2Ru2R1kSytzR80X3zNnpnrL6d99.jpeg)
myApi
@bacondotbuild
An interactive, runnable TypeScript val by bacondotbuild
Script
export function myApi(name) {
return "hi " + name;
myApi
@lol
An interactive, runnable TypeScript val by lol
Script
export function myApi(name) {
return "hi " + name;
prompt_to_code_auto_refresh_codebed
@trob
@jsxImportSource https://esm.sh/react
HTTP
function debounce(func, wait) {
return function executedFunction(...args) {
function App() {
function client() {
function stripCodeFences(code: string): string {
function extractMessage(logOutput: string): string {
async function retryWithBackoff(fn: () => Promise<any>, maxRetries = 5) {
export default async function server(request: Request): Promise<Response> {
const { OpenAI } = await import("https://esm.town/v/std/openai");
const openai = new OpenAI();
val_wGlPXo8a3y
@dhvanil
An interactive, runnable TypeScript val by dhvanil
HTTP
export async function val_wGlPXo8a3y(req) {
try {
// Execute the code directly and capture its result
![stevekrouse avatar](https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg)
neatEmeraldVicuna
@stevekrouse
Twitter/𝕏 keyword alerts Custom notifications for when you, your company, or anything you care about is mentioned on Twitter. If you believe in Twitter/𝕏-driven development, you want to get notified
when anyone is talking about your tech, even if they're not tagging you. To get this Twitter Alert bot running for you,
fork this val and modify the query and where the notification gets delivered. 1. Query Change the keywords for what you want to get notified for
and the excludes for what you don't want to get notified for. You can use Twitter's search operators to customize your query, for some collection of keywords, filtering out others, and much more! 2. Notification Below I'm sending these mentions to a public channel in our company Discord, but you can customize that to whatever you want, @std/email, Slack, Telegram, whatever. Twitter Data & Limitations The Twitter API has become unusable. This val gets Twitter data via SocialData ,
an affordable Twitter scraping API. In order to make this val easy for
you to fork & use without signing up for another API, I am proxying
SocialData via @stevekrouse/socialDataProxy. Val Town Pro users can call this proxy
100 times per day, so be sure not to set this cron to run more than once every 15 min. If you want to run it more, get your own SocialData
API token and pay for it directly.
Cron
import { zodResponseFormat } from "https://esm.sh/openai/helpers/zod";
import { z } from "https://esm.sh/zod";
import { OpenAI } from "https://esm.town/v/std/openai";
import { discordWebhook } from "https://esm.town/v/stevekrouse/discordWebhook";
.join(" OR ") + " " + excludes;
const openai = new OpenAI();
const RelevanceSchema = z.object({
reason: z.string(),
async function relevant(t: Tweet): Promise<z.infer<typeof RelevanceSchema>> {
const systemPrompt = `Determine if this tweet JSON is relevant to Shorebird on the following criteria:
try {
const completion = await openai.beta.chat.completions.parse({
model: "gpt-4o-mini",
} catch (error) {
console.error("Error parsing OpenAI response:", error);
return { isRelevant: false, confidence: 0, reason: "Error in processing" };
const isProd = true;
export async function twitterAlert({ lastRunAt }: Interval) {
// search
freshBeigeScorpion
@jeffreyyoung
Shows a preview and then says meow for 5 seconds
https://poe.com/preview-then-slow things to note: don't put underscores in the name name, it stops working
HTTP
* Returns a response to the user's query
async function getResponse(req: Query, send: SendEventFn) {
send("meta", { content_type: "text/markdown" });
* Returns your bot's settings
async function getBotSettings(): Promise<BotSettings> {
return {
) => void;
function encodeEvent(event: string, data: any = {}) {
return new TextEncoder().encode(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`);
export default async function(req: Request): Promise<Response> {
const reqBody = await req.json()
runGlif
@jamiedubs
glif API mini-SDK
make generative magical AI things set your GLIF_API_TOKEN in your own ENV, or you'll hit rate limits: https://glif.app/settings/api-tokens call from your val like: import { runGlif } from "https://esm.town/v/jamiedubs/runGlif";
const json = await runGlif({ id: "cluu91eda000cv8jd675qsrby", inputs: ["hello", "world"] });
console.log(json);
Script
output?: string;
outputFull?: object;
export async function runGlif({
id,
inputs,
![webup avatar](https://images.clerk.dev/uploaded/img_2S4HPCT6HNZNKzadzuovxeU1BRZ.webp)
getMemoryBuilder
@webup
An interactive, runnable TypeScript val by webup
Script
import { getModelBuilder } from "https://esm.town/v/webup/getModelBuilder";
export async function getMemoryBuilder(spec: {
type: "buffer" | "summary" | "vector";
provider?: "openai";
} = { type: "buffer" }, options = {}) {
return new BufferMemory();
matches({ type: "summary", provider: "openai" }),
async () => {
return new ConversationSummaryMemory({ llm, ...options });
matches({ type: "vector", provider: "openai" }),
async () => {
type: "embedding",
provider: "openai",
const model = await builder();
![webup avatar](https://images.clerk.dev/uploaded/img_2S4HPCT6HNZNKzadzuovxeU1BRZ.webp)
getSampleDocuments
@webup
An interactive, runnable TypeScript val by webup
Script
export async function getSampleDocuments() {
const { Document } = await import("npm:langchain/document");
const docs = [
cerebras_coder
@jft51
This is an AI code assistant powered by Cerebras , running llama3.3-70b. Inspired by Hassan's Llama Coder . Setup Sign up for Cerebras Get a Cerebras API Key Save it in a Val Town environment variable called CEREBRAS_API_KEY Todos I'm looking for collaborators to help. Fork & send me PRs! [ ] Experiment with two prompt chain (started here )
HTTP
title: "Todo App",
code:
"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Task Master</title>\n <link href=\"https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css\" rel=\"stylesheet\">\n</head>\n<body class=\"bg-gray-100\">\n <div class=\"max-w-md mx-auto mt-12 p-6 rounded-lg shadow-md bg-white\">\n <div class=\"flex justify-between items-center mb-6\">\n <h2 class=\"text-2xl font-bold\">Task Master</h2>\n <span class=\"text-gray-600\">Manage your tasks efficiently</span>\n </div>\n <ul class=\"todo-list\" id=\"todo-list\"></ul>\n <div class=\"add-todo mt-6 flex justify-between items-center\">\n <input type=\"text\" id=\"todo-input\" placeholder=\"Add new task\" class=\"w-full py-2 pl-10 text-sm text-gray-800 border border-gray-400 rounded-lg focus:outline-none focus:ring-2 focus:ring-gray-600 bg-gray-50\">\n <button type=\"button\" id=\"add-todo-btn\" class=\"ml-4 px-4 py-2 bg-green-500 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-green-700 hover:shadow-lg focus:bg-green-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-green-800 active:shadow-lg transition duration-150 ease-in-out\">Add Task</button>\n </div>\n <div class=\"mt-6 text-center text-gray-600\">\n Built on <a href=\"https://cerebrascoder.com\" target=\"_blank\" class=\"text-gray-900 underline\">Cerebras Coder</a>\n </div>\n </div>\n\n <script>\n // Get the todo list and add todo button elements\n const todoList = document.getElementById('todo-list');\n const addTodoBtn = document.getElementById('add-todo-btn');\n const todoInput = document.getElementById('todo-input');\n\n // Load todos from local storage\n let todos = JSON.parse(localStorage.getItem('todos')) || [];\n\n // Function to render the todo list\n function renderTodoList() {\n todoList.innerHTML = '';\n todos.forEach((todo, index) => {\n const todoItem = document.createElement('li');\n todoItem.innerHTML = `\n <div class=\"flex justify-between items-center py-4 border-b border-gray-300\">\n <div class=\"flex items-center\">\n <input type=\"checkbox\" id=\"todo-${index}\" class=\"mr-4\" ${todo.completed ? 'checked' : ''}>\n <span class=\"todo-text ${todo.completed ? 'text-gray-400 line-through' : 'text-gray-600'}\">${todo.text}</span>\n </div>\n <button type=\"button\" class=\"px-4 py-2 bg-red-500 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-red-700 hover:shadow-lg focus:bg-red-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-red-800 active:shadow-lg transition duration-150 ease-in-out delete-todo\" data-index=\"${index}\">Delete</button>\n </div>\n `;\n todoList.appendChild(todoItem);\n });\n }\n\n // Render the initial todo list\n renderTodoList();\n\n // Add event listener to the add todo button\n addTodoBtn.addEventListener('click', () => {\n const todoText = todoInput.value.trim();\n if (todoText) {\n todos.push({ text: todoText, completed: false });\n localStorage.setItem('todos', JSON.stringify(todos));\n todoInput.value = '';\n renderTodoList();\n }\n });\n\n // Add event listener to the todo list\n todoList.addEventListener('change', (e) => {\n if (e.target.type === 'checkbox') {\n const index = parseInt(e.target.id.split('-')[1]);\n todos[index].completed = e.target.checked;\n localStorage.setItem('todos', JSON.stringify(todos));\n renderTodoList();\n }\n });\n\n // Add event listener to the delete todo buttons\n todoList.addEventListener('click', (e) => {\n if (e.target.classList.contains('delete-todo')) {\n const index = parseInt(e.target.dataset.index);\n todos.splice(index, 1);\n localStorage.setItem('todos', JSON.stringify(todos));\n renderTodoList();\n }\n });\n </script>\n</body>\n</html>",
performance: {
tokensPerSecond: 2298.56,
title: "Markdown Editor",
code:
"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Markdown Editor</title>\n <link href=\"https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css\" rel=\"stylesheet\">\n</head>\n<body class=\"bg-white\">\n <div class=\"max-w-full mx-auto p-4 pt-6 md:p-6 lg:p-8\">\n <h1 class=\"text-3xl text-center mb-4\">Markdown Editor</h1>\n <div class=\"flex flex-row\">\n <div class=\"editor p-4 rounded-lg border border-gray-200 w-full md:w-1/2\">\n <textarea id=\"editor\" class=\"w-full h-screen p-2 border border-gray-200 rounded-lg\" placeholder=\"Type your Markdown here...\"></textarea>\n </div>\n <div class=\"preview p-4 rounded-lg border border-gray-200 w-full md:w-1/2 ml-2 md:ml-4 lg:ml-8\">\n <div id=\"preview\"></div>\n </div>\n </div>\n <p class=\"text-center mt-4\">Built on <a href=\"https://cerebrascoder.com\">Cerebras Coder</a></p>\n </div>\n\n <script>\n const editor = document.getElementById('editor');\n const preview = document.getElementById('preview');\n\n // Initialize textarea with default markdown\n const defaultMarkdown = `\n# Introduction to Markdown\nMarkdown is a lightweight markup language that is easy to read and write. It is often used for formatting text in plain text editors, chat applications, and even web pages.\n\n## Headers\nHeaders are denoted by the # symbol followed by a space. The number of # symbols determines the level of the header:\n# Heading 1\n## Heading 2\n### Heading 3\n\n## Emphasis\nYou can use emphasis to make your text **bold** or *italic*:\n*Italics*\n**Bold**\n\n## Lists\nYou can use lists to organize your text:\n* Item 1\n* Item 2\n* Item 3\nOr\n1. Item 1\n2. Item 2\n3. Item 3\n\n## Links\nYou can use links to reference external resources:\n[Google](https://www.google.com)\n\n## Images\nYou can use images to add visual content:\n![Markdown Logo](https://upload.wikimedia.org/wikipedia/commons/thumb/4/48/Markdown-mark.svg/208px-Markdown-mark.svg.png)\n`;\n editor.value = defaultMarkdown;\n\n // Update preview on input\n editor.addEventListener('input', () => {\n const markdown = editor.value;\n const html = markdownToHtml(markdown);\n preview.innerHTML = html;\n });\n\n // Initialize preview with default markdown\n const defaultHtml = markdownToHtml(defaultMarkdown);\n preview.innerHTML = defaultHtml;\n\n // Function to convert Markdown to HTML\n function markdownToHtml(markdown) {\n // Bold\n markdown = markdown.replace(/\\*\\*(.*?)\\*\\*/g, '<b>$1</b>');\n\n // Italic\n markdown = markdown.replace(/\\*(.*?)\\*/g, '<i>$1</i>');\n\n // Links\n markdown = markdown.replace(/\\[(.*?)\\]\\((.*?)\\)/g, '<a href=\"$2\">$1</a>');\n\n // Images\n markdown = markdown.replace(/!\\[(.*?)\\]\\((.*?)\\)/g, '<img src=\"$2\" alt=\"$1\">');\n\n // Headings\n markdown = markdown.replace(/(^#{1,6} )(.*)/gm, (match, level, text) => {\n return `<h${level.length}>${text}</h${level.length}>`;\n });\n\n // Lists\n markdown = markdown.replace(/^(\\*|\\d+\\.) (.*)/gm, (match, marker, text) => {\n if (marker.startsWith('*')) {\n return `<li>${text}</li>`;\n } else {\n return `<li>${text}</li>`;\n }\n });\n\n // Line breaks\n markdown = markdown.replace(/\\n/g, '<br>');\n\n // Fix for nested lists\n markdown = markdown.replace(/<li><li>/g, '<li>');\n markdown = markdown.replace(/<\\/li><\\/li>/g, '</li>');\n\n // Wrap lists in ul\n markdown = markdown.replace(/(<li>.*<\\/li>)/g, '<ul>$1</ul>');\n\n return markdown;\n }\n </script>\n</body>\n</html>",
performance: {
tokensPerSecond: 4092.96,
valreadmegenerator
@prashamtrivedi
Val Town README Generator Welcome to the Val Town README Generator ! 🚀 Get ready to effortlessly generate elegant and informative README files for your Val Projects. This tool leverages AI to create well-structured and insightful documentation for your Val code. Features Theme Awareness: 🌑🌞 Automatically adjusts to your system's dark/light mode preference. Responsive Layout: 📱🖥️ Built with a beautiful and modern UI using React and TailwindCSS, ensuring a pleasant experience across devices. Live Preview and Copy: 📋 Instantly view the generated README and easily copy it with just a click. Direct Readme Link: 🔗 Shareable link for each generated README for quick access. How It Works Follow these simple steps to generate a README: Enter Details: Provide your Val username and the Val name you want to generate a README for. Generate: Click on 'Generate README' and watch as the application swiftly fetches and processes the Val code to create a Markdown README. Copy and Share: Use the 'Copy' button to copy the README for your use, or share the link directly with peers. Technologies Used React: For building the interactive user interface. React DOM: To render components efficiently. TailwindCSS: For styling the application. Deno: The server-side environment. ValTown SDK: Integrated to fetch Val details. OpenAI GPT-4: To generate natural language README content. JavaScript Modules (ESM): For seamless module imports. Getting Started This project is actively deployed and accessible via the browser. Simply navigate to the running instance, input your details, and let the tool handle the rest. Enjoy generating READMEs without the need for local setup. Contributing While the project is not currently set up for local development, your interest and feedback are highly valued. Feel free to explore the code and suggest enhancements or improvements via pull requests or through the issue tracker. Contributions If you've made a substantial contribution to the project, feel free to add your name here! For any questions or guidance, join the discussions in our project repository. License MIT License. Feel free to use, modify, and distribute this application as per the terms of the license. We hope you find the Val Town README Generator a valuable tool in your development workflow. Happy Documenting! 🎉
HTTP
- **ValTown SDK:** Integrated to fetch Val details.
- **OpenAI GPT-4:** To generate natural language README content.
- **JavaScript Modules (ESM):** For seamless module imports.
import React, { useRef, useState, useEffect } from "https://esm.sh/react@18.2.0";
function App() {
const [username, setUsername] = useState("");
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
const url = new URL(request.url);
valName = valNamePart;
const { OpenAI } = await import("https://esm.town/v/std/openai");
const openai = new OpenAI();
const valTownClient = new ValTown({
try {
const completion = await openai.chat.completions.create({
model: "gpt-4o",
} catch (error) {
console.error('Error in server function:', error);
return new Response(`Error: ${error.message}`, { status: 500 });