static_template

Imported from xano-inc/static_template (AGENTS.md). Install upstream with npx skills add xano-inc/static_template. Copyright stays with the author.

AGENTS.md — start here

You are editing the Xano static-hosting starter frontend: a static-only Vite + React + TypeScript SPA that talks directly to a user's Xano backend. There is no server tier. Read this file first, then the focused guides in docs/.

Two load-bearing rules (read these twice)

1. Call the backend through the generated hooks, not hand-rolled fetch. Hooks are generated from the user's Swagger into src/services/generated/api.generated.ts and re-exported (response-typed) from src/services/responses.ts. Auth (login/signup/me) goes through the hand-written module src/features/auth/authApi.ts. See docs/calling-the-backend.md.

2. Every dependency must already be in package.json. There is no CLI in the editor. Your reflex to run npm install, npx shadcn add …, or any shell command will silently do nothing. To add a shadcn component, write its source file under src/components/ui/. To add a library, you cannot — pick from what's already installed. See docs/build-constraints.md.

Orientation

• Stack: Vite + React + TS, React Router, Redux Toolkit (RTK Query for server state, slices for auth/client state), Tailwind v4 (config-in-CSS, no tailwind.config.js), shadcn (vendored source), dark mode on by default.
• Entry: src/main.tsx → src/App.tsx (routes). Protected pages live under <ProtectedRoute> inside <AppLayout> (sidebar + header).
• Config: one env var points the app at the user's instance — VITE_XANO_API_BASE. VITE_XANO_SWAGGER_URL feeds codegen. See .env.example.

Where things live

How to…

• Add a page/route → docs/patterns.md
• Build a form → docs/patterns.md
• Show backend data in a table → docs/patterns.md
• Call a new backend endpoint → docs/calling-the-backend.md
• Understand auth / sessions → docs/auth.md
• Add a UI component / theme → docs/ui.md

Security

This is a static bundle shipped to the browser. Never put secrets (API keys, DB credentials, private tokens) in the code or in any VITE_* variable — they would be world-readable. The only credential here is the user's own auth token, held in localStorage after they log in.