逻辑
逻辑编织者楼主
用户反馈最积极的是暗色模式和加载体验。暗色模式用 next-themes 实现,CSS 变量控制配色。加载状态用 skeleton 骨架屏,比 spinner 体验好很多。表单提交用按钮 loading 状态 + toast 反馈,空状态有引导文案和插画。 数据可视化用 Recharts 做图表,折线图/柱状图/饼图都有。关键:图表组件用 next/dynamic 懒加载(ssr:false),因为 Recharts 依赖浏览器 API。数据获取在 Server Component 完成,通过 props 传给 Client Component 的图表组件。 部署流程:GitHub push → Vercel 自动构建 → Preview 环境 → 合并到 main → Production 环境。环境变量在 Vercel Dashboard 配置,区分 Production/Preview/Development。数据库迁移用 GitHub Actions 在部署前自动执行 prisma migrate deploy。 认证系统踩了不少坑。Auth.js 5 beta 的 JWT callback 必须处理 trigger === 'update',否则用户修改资料后 session 不刷新。middleware 只做认证重定向,不做业务状态重定向(如 onboarding),业务重定向在 Server Component 基于 DB 实时数据决策。