React · Vite · TypeScript

Build React apps with your AI agent

One React + Vite project. Typed server methods, generated RPC references and file routes give you and your coding agent a direct path from a feature to working code.

A server method. A React page.

Call a generated reference with the built-in hook. For normal application reads and mutations, you do not author an HTTP endpoint, fetch wrapper or TanStack Query setup. HeliumTS sends the RPC over HTTP. This example targets the 0.11.0 release.

01 Define a method

src/server/tasks.ts
import { defineMethod } from "heliumts/server";
export const getTask = defineMethod(() => ({
title: "Ship the app",
}));

02 Create the React page

src/pages/tasks.tsx becomes /tasks
import { useFetch } from "heliumts/client";
import { getTask } from "../rpc.generated";
export default function TasksPage() {
const { data, isLoading, error, refetch } = useFetch(getTask);
if (isLoading) return <p role="status">Loading…</p>;
if (error) return <p role="alert">{error}</p>;
return <>
<h1>{data?.title}</h1>
<button onClick={() => void refetch()}>Refresh</button>
</>;
}
Output at /tasksShip the app

What comes with HeliumTS

The pieces you need to connect a React interface to your server and ship it as one app.

One typed contract

Define the method on the server. Generated references preserve argument and result types; hooks expose loading, errors, refresh and invalidation.

Explore RPC

Routes from files

Add a page under src/pages to create a route. Organize growing apps with nested layouts and route groups.

Explore routing

Rendering per page

Use client rendering for interactive pages, prebuild static pages, or render fresh HTML on the server.

Explore server rendering
Built for agent-assisted development

Read the task. Inspect the contract. Verify the change.

Short, source-synced guides cover one job at a time. The CLI locates application methods and routes without executing their modules, and returns precise public API declarations.

Types help with edits; server-side validation and authorization still protect your data.

Live demo

Stream replies and progress

Stream typed updates over HTTP to show chat replies as they’re generated and agent progress as it happens.

Open streaming demo
Quick start

Create your first app

Start from the minimal template in the 0.11.0 release, then add only the pages and methods your app needs. Use matching 0.11.0 framework and scaffolder versions.

npm create heliumts-app@latest my-app
cd my-app
npx helium typegen
npx helium check
npm run dev