1/** @jsxImportSource https://esm.sh/react@19 */
2import { useEffect, useState } from "https://esm.sh/react@19";
3import { BackButton, Button, ShareButton } from "./ui.tsx";
4
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState } from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4
5const FREE_FOOD_ITEMS = [
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { Hono } from "https://esm.sh/hono";
3import { debounce } from "https://esm.sh/lodash-es";
4import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
5import { useDropzone } from "https://esm.sh/react-dropzone?deps=react@18.2.0,react-dom@18.2.0";
6import React, { ReactNode, useCallback, useEffect, useRef, useState } from "https://esm.sh/react@18.2.0";
7import { lastlogin } from "https://esm.town/v/stevekrouse/lastlogin_safe";
8import { LoginWithGoogleButton } from "https://esm.town/v/stevekrouse/LoginWithGoogleButton";
9
10interface TooltipProps {
11 children: ReactNode;
12 content: string;
13}
6
7Versions 0-17 of this val were done with Hono and server-rendering.
8Versions 18+ were generated with Townie and use client-side React.
9
10To use this val, fork it to your account.
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { Hono } from "https://esm.sh/hono";
3import { debounce } from "https://esm.sh/lodash-es";
4import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
5import { useDropzone } from "https://esm.sh/react-dropzone?deps=react@18.2.0,react-dom@18.2.0";
6import React, { ReactNode, useCallback, useEffect, useRef, useState } from "https://esm.sh/react@18.2.0";
7import { lastlogin } from "https://esm.town/v/stevekrouse/lastlogin_safe";
8import { LoginWithGoogleButton } from "https://esm.town/v/stevekrouse/LoginWithGoogleButton";
9
10interface TooltipProps {
11 children: ReactNode;
12 content: string;
13}
1/** @jsxImportSource https://esm.sh/react@19 */
2import { createRoot } from "https://esm.sh/react-dom@19/client";
3import { BrowserRouter } from "https://esm.sh/react-router@7";
4import { App } from "./App.tsx";
5
1/** @jsxImportSource https://esm.sh/react@19 */
2import React from "https://esm.sh/react@19"
3import { hydrateRoot } from "https://esm.sh/react-dom@19/client";
4import App from "./App.tsx"
5
1/** @jsxImportSource https://esm.sh/react@19 */
2import { useState } from "https://esm.sh/react@19";
3
4export default function App () {
3A list of minimal starter projects to show you how to do various things in Val Town.
4
5- [React Starter][]
6- [React Streaming Starter][]
7- [React SPA Starter][]
8- [Remark Starter][]
9- [Remark Frontmatter Starter][]
11
12<!--
13- [x] React Starter
14- [x] React Streaming Starter
15- [x] React SPA Starter
16- [x] Remark Starter
17- [x] Remark Frontmatter Starter
20- [ ] CSS Starter
21- [ ] Vuejs Starter
22- [ ] Preact
23- [ ] Hono
24- [ ] HTM
26-->
27
28[react starter]: https://val.town/x/jxnblk/react-starter
29[react streaming starter]: https://val.town/x/jxnblk/react-streaming-starter
30[react spa starter]: https://val.town/x/jxnblk/react-spa-starter
31[remark starter]: https://www.val.town/x/jxnblk/remark-starter
32[remark frontmatter starter]: https://www.val.town/x/jxnblk/remark-frontmatter-starter
1# React Streaming Starter
2
3Minimal React Streaming example for Val Town
4[View Demo](https://jxnblk--d4cf35880b3211f0b331569c3dd06744.web.val.run)
5
6Remix this project to start building your own React app
7
8## How it works
10The `http.tsx` file is the main entry point and serves the app.
11It renders the `App` component on the server and sends a streaming response;
12The `bootstrapModules` option adds a `<script>` tag that loads the `client.tsx` module to hydrate the React app in the browser.
13
14The `App.tsx` file is the root component of the React app. You can add more components and functionality as needed.
15
16---
18_See also:_
19
20- [React Starter][]
21- [React SPA Starter][]
22
23[React Starter]: https://val.town/x/jxnblk/react-starter
24[React SPA Starter]: https://val.town/x/jxnblk/react-spa-starter
