Search

curiousMoccasinWeasel

@all

@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> {

ssr

@pomdtr

Todo [x] extract params from request paths using urlpatterns [ ] add a Form component [ ] add support for Layouts [ ] support other types url in router ("https://val.town/v/user/val" or "owner/val")

Script

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

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

import { html } from "https://esm.town/v/stevekrouse/html";

export type PageProps<T = {}> = T & {

exceptionalBrownWolf

@CoachCompanion

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

HTTP

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

import React, { useState, useEffect, useRef } from "https://esm.sh/react@18.2.0";

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

import { marked } from "https://esm.sh/marked@4.3.0";

mortgageCalculator

@IzzyM

@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 calculateMortgage(principal: number, annualRate: number, years: number) {

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") { client(); }

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

dateme_form_react

@stevekrouse

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

Script

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

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

const Link = ({ href, children }) => {

vibe_playground

@ryanguill

An interactive, runnable TypeScript val by ryanguill

Script

<body>

</div>

waka

@loading

@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";

enum Color {

</div>

function client() {

createRoot(document.getElementById("root")!).render(<App />);

if (typeof document !== "undefined") {

client();

async function fetchWakaTimeData(): Promise<DataPoint[]> {

whiteNewt

@maxm

@jsxImportSource https://esm.sh/react

HTTP

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

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

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

return new Response(

verbalScarletAntelope

@vawogbemi

WIP Searcher for HN whos hiring posts HonoJs doesn't support render for async components so the style is off for the home page. And the state changes don't register in html rendering so thinking of using react instead.

HTTP

HonoJs doesn't support render for async components so the style is off for the home page.

And the state changes don't register in html rendering so thinking of using react instead.

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

import React, { useCallback, useEffect, useReducer, useRef, useState } from "https://esm.sh/react";

import { hydrateRoot } from "https://esm.sh/react-dom/client";

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

import { hnSearch } from "https://esm.town/v/stevekrouse/hnSearch";

freshFetti

@all

@jsxImportSource https://esm.sh/react

HTTP

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

import confetti from "https://esm.sh/canvas-confetti@1.6.0";

import React, { useCallback, useEffect, useState } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

type ConfettiOptions = {

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") { client(); }

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

status

@stevekrouse

Uptime Status Page This is the status page for the data generated by this uptime cron: @stevekrouse/uptime

HTTP

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

import { sqlite } from "https://esm.town/v/std/sqlite?v=6";

import { html } from "https://esm.town/v/stevekrouse/html";

import { SparklineSVG } from "https://esm.town/v/stevekrouse/sparklineSVGReact";

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

function StatusRow({ rows }) {

addReactFromCDN

@liamdanielduffy

An interactive, runnable TypeScript val by liamdanielduffy

Script

import { scriptTag } from "https://esm.town/v/liamdanielduffy/scriptTag";

export function addReactFromCDN(): string {

const reactDom = scriptTag({

src: "https://unpkg.com/react-dom@18.2.0/umd/react-dom.production.min.js",

const react = scriptTag({

src: "https://unpkg.com/react@18/umd/react.production.min.js",

return [react, reactDom].join(" ");

deletebio

@yawnxyz

// at ms2, we're collecting mge vs. bacteria data over time, to build models that help us create, read, update, and delete bacteria from anywhere.

HTTP

float[] sizes = {1.0, 0.85, 0.7, 0.55, 0.4};

int[] sides = {6, 12, 8, 6, 4};

for (int i = 0; i < sizes.length; i++) {

drawPolygon(sides[i], hexagonSize * sizes[i]);

void drawPolygon(int sides, float size) {

beginShape();

for (int i = 0; i < sides; i++) {

float angle = TWO_PI / sides * i;

float x = cos(angle) * size;

csvToSqliteUploader

@vawogbemi

Fork this val and then run, not sure if it will create the table in my database if you run this.

HTTP

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

import { parse } from "https://esm.sh/csv-parse/browser/esm/sync";

import React, { useState } 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> {

killamix

@all

@jsxImportSource https://esm.sh/react

HTTP

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

import React, { useState, useEffect, useCallback, useRef } from "https://esm.sh/react";

import { createRoot } from "https://esm.sh/react-dom/client";

// Text prompt mappings for encoders

</div>

function client() {

createRoot(document.getElementById("root")).render(<App />);

if (typeof document !== "undefined") {

client();

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

…

47 48

50 51

…

251