mcpField
A
ai-chat

ai-chat

github.com/andrelandgraf开发23156 次安装22 周前更新
代码仓库

关于 ai-chat

一套用于构建 AI 聊天应用的配方技能,涵盖对话持久化、列表管理和自动标题生成,并按顺序指导开发者完成所需设置与实现步骤。

主要功能

  1. 01将聊天记录持久化到 Neon Postgres
  2. 02搜索、重命名和删除聊天
  3. 03在后台生成聊天标题
  4. 04支持消息部分、工具和推理

适用场景

  1. 01构建可保存对话的 AI 聊天应用
  2. 02添加可搜索和管理的聊天记录
  3. 03根据首条消息生成聊天标题

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/andrelandgraf/fullstackrecipes --skill ai-chat

安装后在 Claude Code 中输入/ai-chat确认已加载。

详细介绍

AI 聊天

构建完整的 AI 聊天应用,支持数据库持久化、聊天列表管理和自动生成标题。

前置条件

请先按顺序完成以下指南:

使用 better-env 进行类型安全的环境配置

使用 better-env 配置模块,以类型安全的方式访问服务器端和公共环境变量、功能开关,并配置二选一的凭据约束。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/config-schema-setup
配置 Neon + Drizzle

使用 Drizzle ORM 将 Next.js 应用连接到 Neon Postgres,并为 Vercel 无服务器函数优化连接池。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/neon-drizzle-setup
在 Vercel 上运行 Next.js

创建一个基于 Bun 运行的 Next.js 应用,配置开发环境,并设置推送代码时自动部署到 Vercel。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/nextjs-on-vercel
Shadcn UI 和主题

添加支持深色模式的 Shadcn UI 组件,并使用 next-themes。包括主题提供程序和 CSS 变量配置。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/shadcn-ui-setup
身份验证

使用 Better Auth 构建完整的身份验证系统,包括电子邮件验证、密码重置、受保护路由和账户管理。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/authentication
使用 nuqs 管理 URL 状态

将 React 状态同步到 URL 查询参数,以支持可分享的筛选条件、搜索查询,以及指向模态对话框的深层链接。在浏览器前进和后退导航时保留 UI 状态。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/nuqs-setup
配置 Pino 日志

使用 Pino 配置结构化日志。在开发环境中输出易读的彩色日志,在生产环境中输出结构化 JSON,以便日志聚合服务处理。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/pino-logging-setup
配置 Workflow Development Kit

安装并配置 Workflow Development Kit,以构建可恢复、持久化的 AI Agent 工作流,支持步骤级持久化、流恢复和 Agent 编排。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/workflow-setup

操作指南 — 按顺序完成以下指南

使用 Neon 持久化 AI 聊天记录

将 AI 聊天对话持久化到 Neon Postgres,全面支持 AI SDK 消息部分,包括工具、推理和流式传输。使用 UUID v7 生成可按时间顺序排序的 ID。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/ai-chat-persistence
聊天列表和管理

构建聊天列表页面,支持搜索、重命名和删除。使用 nuqs 同步 URL 筛选条件,并支持可通过深层链接访问的模态对话框。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/chat-list
自动生成聊天名称

使用快速的大模型,根据第一条消息生成描述性聊天标题。此操作作为后台工作流步骤,在主要响应完成后运行,以免延迟用户体验。

curl -H "Accept: text/markdown" https://fullstackrecipes.com/api/recipes/chat-naming

评论

支持 Markdown