Search

reactExample

@officialrajdeepsingh

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

HTTP

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

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

export const reactExample = (request: Request) =>

new Response(

endearingChocolateBuzzard

@dishantpal

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

HTTP

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

import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";

export default (req: Request) => {

return new Response(

tomatoSawfish

@tempguy

@jsxImportSource https://esm.sh/preact

HTTP

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

import { render } from "npm:preact-render-to-string";

export default async function(req: Request) {

return new Response(

transcendentChocolateStork

@shabeer

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

HTTP

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

import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";

export default (req: Request) => {

return new Response(

dateme_faq

@stevekrouse

@jsxImportSource npm:hono@3/jsx

1 9

Script

/** @jsxImportSource npm:hono@3/jsx */

import { handler } from "https://esm.town/v/pomdtr/ssr";

import date_me_faq from "https://esm.town/v/stevekrouse/dateme_faq_react";

import Layout from "https://esm.town/v/stevekrouse/dateme_layout";

let linkClass = "text-sky-600 hover:text-sky-500";

placidGrayCondor

@techMember

@jsxImportSource https://esm.sh/react

HTTP

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

import { renderToString } from "https://esm.sh/react-dom@18/server";

export default (req: Request) => {

return new Response(

valTopicGen

@roramigator

// This val creates a weekly topic generator for Val Town developers to focus their creativity.

HTTP

// The current topic is stored in blob storage, and a new topic is selected each week.

// The val provides an HTTP endpoint to view the current topic and when it will change.

import { jsx } from "https://esm.sh/react/jsx-runtime";

import { blob } from "https://esm.town/v/std/blob";

const topics = [

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

const currentTopic = await getCurrentTopic();

const { renderToString } = await import("https://esm.sh/react-dom/server");

const topicDisplayHtml = renderToString(TopicDisplay(currentTopic));

return new Response(

strivingGrayMarmot

@ChaitanMajhi9006

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

HTTP

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

import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";

export default (req: Request) => {

return new Response(

whiteXerinae

@stevekrouse

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 (v66) 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 [ ] 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 [ ] 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

- [ ] add schema viewing

- [ ] add refresh to table list sidebar after `CREATE/DROP/ALTER` statements

- [ ] add automatic execution of initial select query on double click

- [ ] 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

return c.render(

wittyBeigeRattlesnake

@deepakj22

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

HTTP

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

import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";

export default (req: Request) => {

return new Response(

slackScout

@sarahxc

Slack scout sends a slack notification every time your keywords are mentioned on Twitter, Hacker News, or Reddit. Get notified whenever you, your company, or topics of interest are mentioned online. Built with Browserbase . Inspired by f5bot.com . Full code tutorial . Getting Started To run Slack Scout, you’ll need a Browserbase API key Slack Webhook URL: setup here Twitter Developer API key Browserbase Browserbase is a developer platform to run, manage, and monitor headless browsers at scale. We’ll use Browserbase to navigate to, and scrape our different news sources. We’ll also use Browserbase’s Proxies to ensure we simulate authentic user interactions across multiple browser sessions . Get started with Browserbase for free here . Twitter We’ve decided to use the Twitter API to include Twitter post results. It costs $100 / month to have a Basic Twitter Developer account. If you decide to use Browserbase, we can lend our token. Comment below for access. Once you have the SLACK_WEBHOOK_URL , BROWSERBASE_API_KEY , and TWITTER_BEARER_TOKEN , input all of these as Val Town Environment Variables . Project created by Sarah Chieng and Alex Phan 💌

1 15 3

Cron

### Browserbase

e’s Proxies](https://docs.browserbase.com/features/stealth-mode#proxies-and-residential-ips) to ensure we simulate authentic

Get started with Browserbase for free [here](https://www.browserbase.com/sign-up).

causalCyanFlea

@stevekrouse

Big Weather Display Displays the current day's weather information BIG so you can see it from far away. Currently it's hardcoded for: prospect heights, brooklyn charts of the temp and % change of precipitation Probably easiest for you to fork it and change it to suit your needs vs making it customizable

HTTP

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

import React from "https://esm.sh/react";

import { renderToString } from "https://esm.sh/react-dom/server";

import { DateTime } from "https://esm.sh/luxon";

return (

<React.Fragment key={i}>

</text>

</React.Fragment>

</svg>

caringIvoryNightingale

@reetkumarbind

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

HTTP

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

import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";

export default (req: Request) => {

return new Response(

diplomaticGrayDove

@verfv

@jsxImportSource https://esm.sh/react

Script

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

import { renderToString } from "https://esm.sh/react-dom@18/server";

export default (req: Request) => {

return new Response(

wonderfulRoseSwordfish

@Mr_Mobashshir

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

HTTP

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

import { renderToString } from "https://esm.sh/react-dom@18.2.0/server";

export default (req: Request) => {

return new Response(

…

60 61

63 64

…

252