用途：指导搭建 Vite（React + TypeScript）前端加 FastAPI 后端的全栈应用，适合需要登录鉴权、保存数据（CRUD）、界面响应灵敏或面向非技术干系人展示的场景；只读图表、内部工具或状态无关的场景可用 Streamlit。
技术栈：前端 Vite + React + TypeScript，样式 Tailwind CSS + Shadcn UI，后端 FastAPI（Python），包管理器 pnpm，前后端以 OpenAPI（FastAPI 自动生成）对接。
初始化：mkdir my-app && cd my-app；pnpm create vite@latest frontend --template react-ts，随后 pnpm install，pnpm add tailwindcss @tailwindcss/vite，把 src/index.css 内容替换为 @import "tailwindcss";，再执行 pnpm dlx shadcn@latest init -y --base-color neutral。后端 mkdir backend 后 uv init，uv add fastapi uvicorn pydantic。Tailwind v4 使用 Vite 插件，不要创建 tailwind.config.js。
后端配置：在 main.py 中加入 CORSMiddleware，allow_origins 指向 http://localhost:5173；也可在 vite.config.ts 配置 server.proxy 将 /api 代理到 http://localhost:8000，从而避免 CORS。
契约工作流：先写带 Pydantic 模型的后端，uv run uvicorn main:app --reload 启动后查看 http://localhost:8000/openapi.json，前端依据该契约定义类型并发起类型化 fetch，避免猜测接口。
Shadcn 规则：组件须先安装再使用，如 pnpm dlx shadcn@latest add button，再从 @/components/ui/button 导入，不能从 shadcn-ui 导入；常用组件有 button card input form dialog。
架构原则：前端只做展示，业务逻辑与状态放在 Python 后端，所有请求/响应体使用 Pydantic 模型。运行时分两个终端：后端 uv run uvicorn main:app --reload --port 8000，前端 pnpm run dev（http://localhost:5173）。更复杂应用可用 npx @hey-api/openapi-ts 生成 TypeScript 客户端，或用 TanStack Query 处理缓存与加载状态，但会增加复杂度。限制：上述为简单演示模式，复杂场景需额外工具；未提供收费、部署与安全细节。