Search

Results include substring matches and semantically similar vals. Learn more
ascarden avatar
falDemoApp
@ascarden
@jsxImportSource https://esm.sh/react
HTTP
/** @jsxImportSource https://esm.sh/react */
import { createFalClient } from "https://esm.sh/@fal-ai/client";
import React, { useState } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";
import { falProxyRequest } from "https://esm.town/v/stevekrouse/falProxyRequest";
const [loading, setLoading] = useState(false);
const generateImage = async (e?: React.FormEvent) => {
e?.preventDefault();
try {
const fal = createFalClient({
proxyUrl: "/api/fal/proxy",
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(req: Request): Promise<Response> {
rozek avatar
GDI_EMailSender
@rozek
This val is part of a series of examples to introduce "val.town" in my computer science course at Stuttgart University of Applied Sciences . The idea is to motivate even first-semester students not to wait but to put their ideas into practice from the very beginning and implement web apps with frontend and backend. It contains a simple web page with input elements for an email subject and message which may then be sent to the val creator. Fork this val if you want the email to be sent to you! The code was created using Townie - with only a few small manual corrections. This val is licensed under the MIT License.
HTTP
/** @jsxImportSource https://esm.sh/react */
import React, { useState, useEffect } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";
import { email } from "https://esm.town/v/std/email";
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
rozek avatar
HTTP_digitalClock
@rozek
@jsxImportSource https://esm.sh/preact
HTTP
/** @jsxImportSource https://esm.sh/preact */
import { h, render } from "https://esm.sh/preact";
import { useState, useEffect } from "https://esm.sh/preact/hooks";
import htm from "https://esm.sh/htm";
</p>
function client() {
render(h(App, {}), document.getElementById("root"));
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
Fahad61814 avatar
FHworld
@Fahad61814
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
function WeatherDashboard() {
</div>
function client() {
createRoot(document.getElementById("root")).render(<WeatherDashboard />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
mrshorts avatar
CodeGeneratorApp
@mrshorts
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import React, { useState } from "https://esm.sh/react@18.2.0";
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
function App() {
const [isLoading, setIsLoading] = useState(false);
const handleSubmit = async (e: React.FormEvent) => {
e.preventDefault();
textDecoration: 'none',
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
efoley avatar
groceries
@efoley
@jsxImportSource https://esm.sh/react
HTTP
/** @jsxImportSource https://esm.sh/react */
import React, { useState, useEffect } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";
function App() {
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") {
client();
export default async function server(request: Request): Promise<Response> {
rozek avatar
HTTP_analogClock
@rozek
@jsxImportSource https://esm.sh/preact
HTTP
/** @jsxImportSource https://esm.sh/preact */
import htm from "https://esm.sh/htm";
import { h, render } from "https://esm.sh/preact";
import { useEffect, useState } from "https://esm.sh/preact/hooks";
const html = htm.bind(h);
</div>
function client() {
render(html`<${App} />`, document.getElementById("root"));
if (typeof document !== "undefined") {
client();
export default async function server(request: Request): Promise<Response> {
AppleLamps avatar
X
@AppleLamps
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import React from "https://esm.sh/react@18.2.0";
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
function App() {
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
document.body.appendChild(script);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
websrai avatar
seoKeywordResearchTool
@websrai
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
const SUBSCRIPTION_TIERS = {
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
Kpool avatar
cafetiraCafeAndBilliardTournament
@Kpool
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
function App() {
color: "white",
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
rohernan76 avatar
promptOrangeHookworm
@rohernan76
@jsxImportSource https://esm.sh/react
HTTP
/** @jsxImportSource https://esm.sh/react */
import React, { useState, useEffect } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";
function App() {
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
yawnxyz avatar
redditImageGrab
@yawnxyz
@jsxImportSource https://esm.sh/react
HTTP
/** @jsxImportSource https://esm.sh/react */
import React, { useEffect, useState } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";
import { fetchJSON } from "https://esm.town/v/stevekrouse/fetchJSON?v=41";
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(req: Request): Promise<Response> {
websrai avatar
aigeneratorblog
@websrai
@jsxImportSource https://esm.sh/react@18.2.0
HTTP
/** @jsxImportSource https://esm.sh/react@18.2.0 */
import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
const SUBSCRIPTION_TIERS = {
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") { client(); }
export default async function server(request: Request): Promise<Response> {
rozek avatar
GDI_FormUpload
@rozek
This val is part of a series of examples to introduce "val.town" in my computer science course at Stuttgart University of Applied Sciences . The idea is to motivate even first-semester students not to wait but to put their ideas into practice from the very beginning and implement web apps with frontend and backend. It contains a simple web page showing a form with many different input elements. When submitted, the contents of this form are sent to a preconfigured server which analyzes them and responds with a JSON structure contain all inputs. This structure is finally presented to the user. This val is the companion of https://rozek-gdi_formuploadservice.web.val.run/ which contains the server part (aka "backend") for this example. The code was created using Townie - with only a few small manual corrections. This val is licensed under the MIT License.
HTTP
/** @jsxImportSource https://esm.sh/react */
import React, { useState, useEffect, useMemo } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";
function App() {
</div>
function client() {
const root = document.getElementById("root");
if (typeof document !== "undefined") {
client();
export default async function server(request: Request): Promise<Response> {
namwen avatar
TravelApp
@namwen
@jsxImportSource https://esm.sh/react
HTTP
/** @jsxImportSource https://esm.sh/react */
import { ExternalLinkIcon } from "https://esm.sh/@chakra-ui/icons";
VStack,
} from "https://esm.sh/@chakra-ui/react";
import * as React from "https://esm.sh/react";
// import React, { useEffect, useState } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";
import itinerary from "https://esm.town/v/namwen/veryTealAardvark";
import { renderToString } from "npm:react-dom/server";
function printItinerary() {
</div>
function client() {
createRoot(document.getElementById("root")).render(<App />);
if (typeof document !== "undefined") {
client();
async function server(request: Request) {