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.
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@18.2.0 */
2import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
3import { App } from "./App.tsx";
4
19 status: 200,
20 headers: { "Content-Type
21 /** @jsxImportSource https://esm.sh/react@18.2.0 */
22import React, { useState } from "https://esm.sh/react@18.2.0";
23import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
24
25const ANTIBIOTICS_DATA = [
75 ))}
76 st.js
77import React from "react";
78
79const DiseaseList = ({ diseases }) => {
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { renderToString } from "npm:react-dom@18.2.0/server";
3import { Link } from "../helpers.tsx";
4
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { useEffect, useState } from "https://esm.sh/react@18.2.0";
3
4export function Section({ children }: 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@18.2.0 */
2import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
3import { App } from "./App.tsx";
4
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import fcsdk from "https://esm.sh/@farcaster/frame-sdk";
3import { useEffect, useState } from "https://esm.sh/react@18.2.0";
4import { formatAddress, formatJSON, MonoButtonWithStatus, Section } from "./ui.tsx";
5
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { useState } from "https://esm.sh/react@18.2.0";
3
4export function Example() {
6 <div class="m-5 mb-8">
7 <h1 class="text-4xl font-semibold mb-2">Mini App Starter</h1>
8 <div class="opacity-50">Hono + React + Tailwind + Farcaster Mini App Starter Project on Val Town</div>
9 </div>
10 );