技术栈
| 类别 | 技术 | 说明 |
|---|---|---|
| 框架 | Next.js 16 | React 全栈框架 (App Router) |
| 语言 | TypeScript | 类型安全 |
| 样式 | Tailwind CSS | 实用优先 CSS |
| UI 组件 | shadcn/ui | 基于 Radix UI |
| 状态管理 | Zustand | 轻量级状态管理 |
| AI SDK | Vercel AI SDK v6 | AI 对话集成 |
| 国际化 | next-intl | 多语言支持 |
| 分析 | PostHog | 用户行为分析 |
| 监控 | Sentry | 错误追踪 |
| 认证 | Supabase Auth | 用户认证 |
| 数据获取 | TanStack Query | 服务端状态管理 |
| 2D 渲染 | Pixi.js | 图片画布渲染 |
项目结构
kira-web
app
(home)
auth
gallery
generator
rewind
setting
timeline
user
layout.tsx
globals.css
components
feature
providers
ui
seo
hooks
lib
apis
store
types
models
i18n
messages
public
架构图
部署
- 托管在 Fly.io
- Docker 容器化
- 环境变量配置:
NEXT_PUBLIC_API_URL- 后端 API 地址NEXT_PUBLIC_POSTHOG_KEY- PostHog KeyNEXT_PUBLIC_SUPABASE_*- Supabase 配置NEXT_PUBLIC_SENTRY_DSN- Sentry DSN