1/** @jsxImportSource npm:react@18.2.0 */
2import type { ReactNode } from "npm:react@18.2.0";
3
4export function Layout({ children }: { children: ReactNode }) {
5 return (
6 <html lang="en">
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import Markdown from "https://esm.sh/react-markdown@9?deps=react@18.2.0";
3import { listFiles, readFile } from "https://esm.town/v/std/utils@79-main/index.ts";
4import { renderToString } from "npm:react-dom@18.2.0/server";
5import { Layout } from "./Layout.tsx";
6
44}
45
46function html(children: React.ReactNode) {
47 return new Response(
48 renderToString(
1/** @jsxImportSource https://esm.sh/preact */
2import { type ClassValue, clsx } from "https://esm.sh/clsx";
3import { Peer } from "https://esm.sh/peerjs@1.5.4?bundle-deps";
4import { render } from "https://esm.sh/preact";
5import { useEffect, useRef, useState } from "https://esm.sh/preact/hooks";
6
7interface NDEFRecord {
1/** @jsxImportSource https://esm.sh/react@18.2.0?dev */
2import React, { useState } from "https://esm.sh/react@18.2.0?dev";
3
4interface CreateBranchProps {
25 };
26
27 const handleSubmit = async (e: React.FormEvent) => {
28 e.preventDefault();
29
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
3import React, { useState } from "https://esm.sh/react@18.2.0";
4
5const NO_PHRASES = [
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
3import React, { useState } from "https://esm.sh/react@18.2.0";
4
5const NO_PHRASES = [
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import * as d3 from "https://esm.sh/d3@7";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4import React from "https://esm.sh/react@18.2.0";
5import { svgServer } from "https://esm.town/v/fil/svgServer";
6
76
77function App() {
78 const [currentDate, setCurrentDate] = React.useState(new Date());
79 const [svg, setSvg] = React.useState("");
80
81 React.useEffect(() => {
82 const fetchSvg = () => {
83 const month = currentDate.getMonth() + 1;
16```
17
18Example usage: https://www.val.town/x/std/reactHonoStarter/code/backend/index.ts
1/** @jsxImportSource https://esm.sh/preact */
2import { expect } from "jsr:@std/expect";
3import { makeBadge } from "npm:badge-maker";
4import { render } from "npm:preact-render-to-string";
5import prettyMilliseconds from "npm:pretty-ms";
6import { parseProject } from "./project.ts";
1/** @jsxImportSource https://esm.sh/preact */
2import { makeBadge } from "npm:badge-maker";
3import { render } from "npm:preact-render-to-string";
4import prettyMilliseconds from "npm:pretty-ms";
5
Hono + React + Tailwind + Farcaster Mini App Starter Project
React Router for Hono in Val Town
Write business logic with ease
Meet the new standard for modern TypeScript development.
Type-safe, reactive, framework-agnostic library to manage your business logic.
Follow me if you learn more about JavaScript | TypeScript | React.js | Next.js | Linux | NixOS | Frontend Developer | https://linktr.ee/officialrajdeepsingh