1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, {
3 useEffect,
4 useRef,
5 useState,
6} from "https://esm.sh/react@18.2.0?deps=react@18.2.0";
7import { createRoot } from "https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0,react-dom@18.2.0";
8import type {
9 GeoJSONFeatureCollection,
48
49- **Backend**: Hono.js API framework with TypeScript
50- **Frontend**: React 18 with professional dark mode styling
51- **Mapping**: Leaflet.js with CartoDB dark tiles
52- **Styling**: Custom dark theme with technical monospace typography
189- **Imports:** Use `https://esm.sh` for npm and Deno dependencies to ensure compatibility on server and browser
190- **Storage Strategy:** Only use backend storage if explicitly required; prefer simple static client-side sites
191- **React Configuration:** When using React libraries, pin versions with `?deps=react@18.2.0,react-dom@18.2.0` and start the file with `/** @jsxImportSource https://esm.sh/react@18.2.0 */`
192- Ensure all React dependencies and sub-dependencies are pinned to the same version
193- **Styling:** Default to using TailwindCSS via `<script src="https://cdn.twind.style" crossorigin></script>` unless otherwise specified
194
275 - Always run table creation before querying
276
2773. **React Configuration:**
278 - All React dependencies must be pinned to 18.2.0
279 - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of React files
280 - Rendering issues often come from mismatched React versions
281
2824. **File Handling:**
189- **Imports:** Use `https://esm.sh` for npm and Deno dependencies to ensure compatibility on server and browser
190- **Storage Strategy:** Only use backend storage if explicitly required; prefer simple static client-side sites
191- **React Configuration:** When using React libraries, pin versions with `?deps=react@18.2.0,react-dom@18.2.0` and start the file with `/** @jsxImportSource https://esm.sh/react@18.2.0 */`
192- Ensure all React dependencies and sub-dependencies are pinned to the same version
193- **Styling:** Default to using TailwindCSS via `<script src="https://cdn.twind.style" crossorigin></script>` unless otherwise specified
194
275 - Always run table creation before querying
276
2773. **React Configuration:**
278 - All React dependencies must be pinned to 18.2.0
279 - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of React files
280 - Rendering issues often come from mismatched React versions
281
2824. **File Handling:**
1import React from "https://esm.sh/react@18";
2import { renderToString } from "https://esm.sh/react-dom@18/server";
3import { App } from "./App.tsx";
4import { AtpAgent } from "npm:@atproto/api";
1/** @jsxImportSource https://esm.sh/react */
2import { renderToString } from "npm:react-dom/server";
3import { sqlite } from "https://esm.town/v/std/sqlite";
4
189- **Imports:** Use `https://esm.sh` for npm and Deno dependencies to ensure compatibility on server and browser
190- **Storage Strategy:** Only use backend storage if explicitly required; prefer simple static client-side sites
191- **React Configuration:** When using React libraries, pin versions with `?deps=react@18.2.0,react-dom@18.2.0` and start the file with `/** @jsxImportSource https://esm.sh/react@18.2.0 */`
192- Ensure all React dependencies and sub-dependencies are pinned to the same version
193- **Styling:** Default to using TailwindCSS via `<script src="https://cdn.twind.style" crossorigin></script>` unless otherwise specified
194
275 - Always run table creation before querying
276
2773. **React Configuration:**
278 - All React dependencies must be pinned to 18.2.0
279 - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of React files
280 - Rendering issues often come from mismatched React versions
281
2824. **File Handling:**
1/** @jsxImportSource https://esm.sh/react */
2import { renderToString } from "npm:react-dom/server";
3
4export const reactExample = (request: Request) => {
5 const url = new URL(request.url);
6 const params = Object.fromEntries(url.searchParams);
215- **Storage Strategy:** Only use backend storage if explicitly required; prefer
216 simple static client-side sites
217- **React Configuration:** When using React libraries, pin versions with
218 `?deps=react@18.2.0,react-dom@18.2.0` and start the file with
219 `/** @jsxImportSource https://esm.sh/react@18.2.0 */`
220- Ensure all React dependencies and sub-dependencies are pinned to the same
221 version
222- **Styling:** Default to using TailwindCSS via
313 - Always run table creation before querying
314
3153. **React Configuration:**
316 - All React dependencies must be pinned to 18.2.0
317 - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of
318 React files
319 - Rendering issues often come from mismatched React versions
320
3214. **File Handling:**
1{
2 "name": "tijs-org-react",
3 "version": "1.0.0",
4 "description": "React version of tijs.org website for val.town hosting",
5 "type": "module",
6 "scripts": {
10 },
11 "dependencies": {
12 "react": "^18.2.0",
13 "react-dom": "^18.2.0"
14 },
15 "devDependencies": {
16 "@types/react": "^18.2.0",
17 "@types/react-dom": "^18.2.0",
18 "typescript": "^5.0.0",
19 "vite": "^4.4.0"
