1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { renderToString } from "npm:react-dom@18.2.0/server";
3
4/** @jsxImportSource https://esm.sh/react@18.2.0 */
5import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
6import React, { useState } from "https://esm.sh/react@18.2.0";
7
8const WIKIDATA_SEARCH_URL =
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4
5// Enhanced mock data structures
1import React from 'https://esm.sh/react@18.2.0';
2
3function App() {
1import React from 'https://esm.sh/react@18.2.0';
2import ReactDOM from 'https://esm.sh/react-dom@18.2.0/client';
3import App from './App.js';
4
6// The main entry point for Val Town is the root index.js file
7if (typeof document !== 'undefined') {
8 const root = ReactDOM.createRoot(document.getElementById('root'));
9 root.render(
10 <React.StrictMode>
11 <App />
12 </React.StrictMode>
13 );
14}
7 "autoprefixer": "^10.4.14",
8 "postcss": "^8.4.24",
9 "react": "^18.2.0",
10 "react-dom": "^18.2.0",
11 "react-scripts": "^5.0.1",
12 "tailwindcss": "^3.1.8"
13 },
14 "scripts": {
15 "start": "react-scripts start",
16 "build": "react-scripts build",
17 "test": "react-scripts test",
18 "eject": "react-scripts eject"
19 },
20 "eslintConfig": {
21 "extends": [
22 "react-app",
23 "react-app/jest"
24 ]
25 },
1/** @jsxImportSource https://esm.sh/react */
2import { renderToString } from "npm:react-dom/server";
3
4export default async function(req: Request) {
274 createMemory(
275 "2025-04-13",
276 "Lucas allergic to peanuts - mild reaction only, not anaphylactic.",
277 "telegram",
278 "telegram",
1/**
2 * @jsxImportSource https://esm.sh/react@18.2.0
3 */
4
1# React Hono Val Town Project Starter Template
2
3This is a starter template for a full-stack app in a Val Town Project. The app itself is a simple persistent message board.
1# Frontend
2
3This template is a classic client-side-only React app.
4
5## `index.html`
9This HTML file imports `/frontend/style.css` from `/public/style.css` and `/frontend/favicon.svg` from `/frontend/favicon.svg`. Everything in `/frontend/` is mapped to `/public` by `/backend/index.ts`. This is just a convention. You could import & serve everything out of the same folder name.
10
11This HTML file has a `<div id="root"></div>`, which is where we mount the React app.
12
13This HTML file imports `/frontend/index.tsx` from `/public/index.tsx`, which is the **entrypoint** for all frontend JavaScript, including all the React. It is not a problem that it imports a file with a `.tsx` extension becaues browsers ignore file extensions. They only pay attention to content-types, which is great, because all these files will be returned as transpiled JS with the appropriate JS content type by [stevekrouse/utils/serve-public](https://www.val.town/x/stevekrouse/utils/branch/main/code/serve-public/README.md).)
14
15## `index.tsx`
16
17This file is the **entrypoint** for frontend JavaScript. It imports the React app from `/frontend/components/App.tsx` and mounts it on `<div id="root"></div>`.
18
19It also looks for *bootstrapped* JSON data at `window.__INITIAL_DATA`, and passes that only to the `<App />`.
25## `components/`
26
27This directory is where the React components are stored. They're pretty standard client-side React components.
