1/** @jsxImportSource https://esm.sh/react@19 */
2import fcsdk from "https://esm.sh/@farcaster/frame-sdk";
3import { useEffect, useState } from "https://esm.sh/react@19";
4import { formatAddress, formatJSON, MonoButtonWithStatus, Section } from "./ui.tsx";
5
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
3import React from "https://esm.sh/react@18.2.0";
4
5// Array of random Turkish sentences
1/** @jsxImportSource https://esm.sh/react */
2import { render } from "https://deno.land/x/resvg_wasm/mod.ts";
3import { Hono } from "npm:hono";
1/** @jsxImportSource https://esm.sh/react@19 */
2import fcsdk from "https://esm.sh/@farcaster/frame-sdk";
3import { useQuery } from "https://esm.sh/@tanstack/react-query@5";
4import { useEffect, useState } from "https://esm.sh/react@19";
5
6import { FarcasterMiniApp } from "./components/FarcasterMiniApp.tsx";
1/** @jsxImportSource https://esm.sh/react@19 */
2import { ArrowLeft, Share } from "https://esm.sh/lucide-react";
3import { useEffect, useState } from "https://esm.sh/react@19";
4
5export function Section({ children, ...props }: any) {
1# React Hono Starter
2
3This app is a starter template for client-side React and server-side Hono.
4
5- **Remix** this starter template on the top right to get started.
7- The **entrypoint** is `/backend/index.ts`. That's the backend HTTP server, which also serves the all the frontend assets.
8
9- The **client-side entrypoint** is `/frontend/index.html`, which in turn imports `/frontend/index.tsx`, which in turn imports the React app from `/frontend/App.tsx`.
10
11[React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) is a fuller featured example project, with a SQLite database table, queries, client-side CSS and a favicon, and some shared code that runs on both client and server.
1/** @jsxImportSource https://esm.sh/react@19 */
2import { QueryClient, QueryClientProvider } from "https://esm.sh/@tanstack/react-query@5";
3import { createRoot } from "https://esm.sh/react-dom@19/client";
4import { BrowserRouter } from "https://esm.sh/react-router@7";
5
6import { App } from "./App.tsx";
1/** @jsxImportSource https://esm.sh/react@19 */
2import fcsdk from "https://esm.sh/@farcaster/frame-sdk";
3import { useQuery } from "https://esm.sh/@tanstack/react-query@5";
4import { LoaderCircle, Mic, MicOff } from "https://esm.sh/lucide-react";
5import { NavLink, Route, Routes, useNavigate, useParams } from "https://esm.sh/react-router@7";
6import { useEffect, useRef, useState } from "https://esm.sh/react@19";
7
8import { Button, Input, Section } from "../components/ui.tsx";
1---
2title: "Knee Slide Cursor"
3description: "A fun, interactive soccer-themed cursor effect that reacts to your mouse movements! Featuring a smooth knee-slide animation and goal celebration messages."
4imageUrl: "https://chatgpt.com/backend-api/public_content/enc/eyJpZCI6Im1fNjgwZDhkYjBiNzdjODE5MTkxOTM3Y2ZlODk3NThjM2E6ZmlsZV8wMDAwMDAwMGY4NDg2MjMwOTU5NDRkOTE0ZTFhMTk3ZCIsInRzIjoiNDg0OTIxIiwicCI6InB5aSIsInNpZyI6ImE2MTRjMjZlMTA1ODM0ZmFkZGQzZDU4YTcyMDdjZmYzMzAyZGEzMGNhZWI0ZGEyMjI2YWM5ZGFiNDM4MTdlNjIiLCJ2IjoiMCIsImdpem1vX2lkIjpudWxsfQ=="
5url: "https://kneeslide-cursor.val.run"
6author: "dcm31"
7tags: ["javascript", "react", "cursor-effects", "val-town", "soccer", "interactive"]
8---
1# React Hono Starter
2
3This app is a starter template for client-side React and server-side Hono.
4
5- **Remix** this starter template on the top right to get started.
7- The **entrypoint** is `/backend/index.ts`. That's the backend HTTP server, which also serves the all the frontend assets.
8
9- The **client-side entrypoint** is `/frontend/index.html`, which in turn imports `/frontend/index.tsx`, which in turn imports the React app from `/frontend/components/App.tsx`.
10
11[React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) is a fuller featured example project, with a SQLite database table, queries, client-side CSS and a favicon, and some shared code that runs on both client and server.