AI 学习指南

Next.js SaaS 应用后台

明确 Server/Client 边界、数据契约和权限状态的 Next.js SaaS 后台实现提示词。

编程开发Claude CodeCodexCursor

提示词

为 {{product}} 实现 SaaS 应用后台,模块包括:{{modules}}。已有认证与数据条件:{{authAndData}}。

技术架构固定为 Next.js App Router + React + TypeScript + Tailwind CSS + shadcn/ui。视觉风格为“{{designStyle}}”。保留仓库已有认证、ORM、请求和表单方案,不擅自替换。

Skill 规则:支持时读取 frontend-app-builder、shadcn-best-practices、react-best-practices;读取失败时不得声称已使用,继续遵守本提示词约束。

实施要求:

1. 先绘制路由、角色权限、Server/Client Component 和数据流边界。
2. 未提供数据库或 API 时,只建立接口类型、repository/adapter 和明确标注的 seed 数据,不伪造真实持久化。
3. 鉴权必须在服务端保护数据和操作;隐藏按钮不能代替权限校验。
4. 所有页面覆盖 Loading、Empty、Error、无权限、过期会话和慢请求状态。
5. 写操作处理校验、并发、重复提交和错误回滚;危险操作需要确认。
6. 表格、图表和统计不得生成无法追溯的业务数字。
7. 保证键盘访问、移动端降级、长文本与国际化空间。
8. 使用项目真实命令执行 lint、typecheck、test、build;不得编造通过结果。

交付架构说明、文件改动、完整实现、权限与数据边界、测试结果,以及上线前仍需配置的服务清单。

688 字符

使用场景

适用于需要快速理解、整理或生成 编程开发 内容的任务。请先提供必要上下文,再根据输出结果继续追问和验证。

推荐搭配的 Skills

变量说明

变量名类型必填说明示例
product文本SaaS 产品与用户角色多团队 API 成本管理平台
modules列表需要实现的业务模块概览、用量、账单、成员、设置
authAndData文本已有认证、数据库和接口Auth.js、PostgreSQL、已有 REST API
designStyle文本应用视觉风格专业、稳定、紧凑、低装饰

使用方法

1

复制提示词

2

替换变量

3

发送给 AI

4

检查结果

示例输入

请解释一个递归实现的 Fibonacci 函数,并指出复杂度问题。

示例输出

  1. 说明递归函数的执行过程。
  2. 分析重复计算导致的指数复杂度。
  3. 给出记忆化与迭代优化方案。

优化建议

提供更多上下文

分段解释复杂内容

结合测试与运行结果

指定关注点