
Claude 代码技能用于 AI 应用 • Next.js 16 • AI SDK 7 • pgvector • bun
概览
构建AI应用的技能,尤其是Next.js + bun运行时。 以代理插件(v1.0.0)形式打包,所以同样的技能可以在Claude Code、ChatGPT、Codex、Cursor、GitHub Copilot、VS Code和Kiro中加载。参见安装。 常见工作流程示例代理。随插件自动安装;否则复制到 .claude/agents/。 技能在基于漂移下,随着上游的变化。刷新一个:获取上游文件夹,与本地副本进行差对比,并复制更改的内容文件——但保留本地 SKILL.md 前置,因为名称/描述和跨技能引用通常是定制的。跳过盲目NPX技能更新:没有锁定文件,有些文件夹是从上游重命名的。 该仓库同时也是独立的市场,因此不需要克隆: 这会安装所有23个技能、两个特工和.mcp.json的两个MCP服务器。
概述(AI 翻译)
24项技能和2名代理,用于构建使用Next.js、Bun和现代UI工具的AI应用。
⚡ 快速启动
用Claude Code安装:
然后用/nextjs-ai-skills:ai-app来构建应用,或者
/nextjs-ai-skills:go,在浏览器中检查。相关技能也可激活
是你的请求。
要更新,先运行claude plugin marketplace update laguagu,然后
claude plugin update nextjs-ai-skills@laguagu 在一个壳体中。如果你安装了
插件用旧名 claude-code-nextjs-skills 安装,卸载后安装
nextjs-ai-skills@laguagu。
📋 技能
🚀 应用生成器
| 技能 | 描述 |
|---|---|
| AI-应用 | 全栈AI应用(聊天机器人、代理、仪表盘) |
| Nextjs-shadcn | Next.js + shadcn/ui,带有有意的排版、背景和设计系统lint,通过@shadcn/lint |
| Nextjs-聊天机器人 | 网络聊天机器人模式(HITL、持久化、流媒体) |
🎨 界面与设计
| 技能 | 描述 |
|---|---|
| SHADCN | SHADCN/UI 组件管理 |
| 图标 | 获取图标、旗帜、文件类型徽章和品牌标志(Iconify、svgl) |
| 前端设计 | 新UI或重塑UI的独特视觉方向和排版 |
本页由 AI 翻译,技术细节请以原文为准。
README
以下为原文 README 节选,完整内容请查看原文。
🧠 Claude Code AI Skills
23 skills for building AI applications with Next.js, Bun and modern UI tools.
⚡ Quick Start
Install in Claude Code:
/plugin marketplace add laguagu/claude-code-nextjs-skills
/plugin install nextjs-ai-skills@laguagu
Then use /nextjs-ai-skills:ai-app to build an app or
/nextjs-ai-skills:go to check it in the browser. Relevant skills also activate
from your request.
To update, run claude plugin marketplace update laguagu and then
claude plugin update nextjs-ai-skills@laguagu in a shell. If you installed the
plugin under its old name claude-code-nextjs-skills, uninstall that and install
nextjs-ai-skills@laguagu.
📋 Skills
🚀 App Generators
| Skill | Description |
|---|---|
| ai-app | Full-stack AI app (chatbots, agents, dashboards) |
| nextjs-shadcn | Next.js + shadcn/ui with deliberate typography, backgrounds, and design-system lint via @shadcn/lint |
🎨 UI & Design
| Skill | Description |
|---|---|
| shadcn | shadcn/ui component management |
| icons | Sourcing icons, flags, file-type badges and brand logos (Iconify, svgl) |
| frontend-design | Distinctive visual direction and typography for new or reshaped UI |
| web-design-guidelines | UI/UX review against Web Interface Guidelines |
| chrome-devtools | Live browser inspection via Chrome DevTools MCP (DOM, console, network, performance) |
| go | Browser smoke test — verify recent UI changes work |
⚡ Next.js
| Skill | Description |
|---|---|
| next-best-practices | Installed-version docs for routing, RSC and Next.js integration |
| react-best-practices | React/Next.js performance optimization (Vercel) |
| cache-components | Cache Components, freshness, invalidation and isolation |
| nextjs-seo | SEO (metadata, sitemaps, JSON-LD) |
| vercel-react-view-transitions | React View Transitions and navigation motion |
🤖 AI SDKs
| Skill | Description |
|---|---|
| ai-sdk | Vercel AI SDK version discovery and documentation |
| ai-sdk-6 | AI SDK v6 (agents, streaming, tools) |
| ai-sdk-7 | AI SDK v7 (WorkflowAgent, harnesses, v6→v7 migration) |
| ai-elements | Existing elements.ai-sdk.dev AI Elements installs (deprecated upstream end of November 2026; new chat UI uses shadcn/ui AI Elements) |
| openai-agents-sdk | OpenAI Agents SDK (Python) |
🗄️ Database & Search
| Skill | Description |
|---|
推荐工具
换一个关键词,或者移除筛选条件。
安装
npx skillfish add laguagu/claude-code-nextjs-skills