AI 超级智能体 NextJS

学习自编程导航 AI超级智能体 ↗ 项目,原项目后端技术栈为 JAVA 和 Spring AI ↗
支持 Shadcn UI Registry 快速注册组件和函数,在此查看 Registry 服务列表。本项目代码已 Github 开源 ↗

Made with ❤ by Sawana Huang

Registry 使用引导

快速开始

在 NextJS(或其他 React 框架)项目中使用我定制好的 AI 组件和封装函数,类型安全、通过 T3 Stack 的类型和 Eslint 检验。只需几个简单的步骤,向你的项目中注入写好的代码 - 就像 Shadcn UI ↗ 一样。

终端
# 初始化 Shadcn UI
pnpm dlx shadcn@latest init

# 增加阿里云百炼 ai 提供商
pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/dashscrop-ai-provider.json

# 增加文本生成功能
pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-generate-text-api-and-component-for-dashscrop-ai-provider.json

环境配置

在项目根目录创建 .env 文件,添加必要的环境变量:

DASHSCOPE_API_KEY=your_api_key_here

使用组件

在你的页面中导入并使用文本生成组件:

import GenerateTextDemo from "@/components/generate-text-demo";

export default function YourPage() {
  return (
    <div>
      <h1>AI 文本生成示例</h1>
      <GenerateTextDemo />
    </div>
  );
}

Registry 服务列表

文本生成组件演示

基于 Dashscope AI 提供商的文本生成功能实现,最简版本,包含 API 端点和 React 组件。后端代码前端组件

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-generate-text-api-and-component-for-dashscrop-ai-provider.json

阿里云百炼 AI 提供商

为 AI SDK 设置阿里云百炼 AI 提供商,添加模型提供者到库中。调用函数

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/dashscrop-ai-provider.json

Sealos AI 提供商

为 AI SDK 设置 Sealos AI 提供商,添加模型提供者到库中。调用函数

pnpm dlx shadcn@latest add http://localhost:3000/r/sealos-ai-provider.json

聊天机器人组件

完整的聊天机器人实现,包含 UI 组件和 API 端点。基于 Vercel AI SDK 构建,可无缝集成到 NextJS 应用中。后端代码前端组件

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-chat-bot-component-and-api.json

聊天机器人中间件组件

高级聊天机器人实现,支持LLM中间件功能,包含UI组件、API端点和中间件处理器,用于增强AI交互。中间件处理器后端代码前端组件

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-chat-bot-with-middleware.json

对象生成通知组件

基于 Vercel AI SDK 的对象生成功能实现,用于生成结构化通知对象,包含 Schema 定义、UI 组件和 API 端点。Schema 定义后端代码前端组件

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-object-generation-notification.json

聊天持久化组件(文件系统)

基于本地文件系统的聊天消息持久化实现,包含UI组件、API端点和文件存储工具。适合开发环境和演示使用,无需数据库即可保存聊天历史。存储工具后端代码前端组件聊天页面

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-chat-persistence-local.json

聊天持久化组件(数据库)

基于数据库的聊天消息持久化实现,使用Drizzle ORM进行数据存储,包含UI组件、API端点和数据库存储工具。适合生产环境使用,通过缓存机制提升性能。存储工具后端代码前端组件聊天页面

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-chat-persistence-database.json

RAG 知识库聊天机器人

基于 pgvector 和 PostgreSQL 实现的检索增强生成(RAG)聊天机器人,支持向量相似度搜索,包含UI组件、API端点和数据库工具,用于嵌入式存储和检索。嵌入工具服务端操作前端组件API端点

pnpm dlx shadcn@latest add https://ai-super-agent-yupi-nextjs.hsawana9.com/r/nextjs-rag-database-pgvector.json