ns-ui logo
ns-ui
★ 34
vs
mcp-app-typescript-template logo
mcp-app-typescript-template
★ 21

ns-ui vs mcp-app-typescript-template

ns-ui:ns-ui 是一个包含 200 多个经过严格测试的 React 组件集合,可通过 URL 直接安装,无需传统的包依赖。它提供内敛的生产级组件和华丽的展示组件,并且安装后拥有完整的源代码所有权,方便自定义。;mcp-app-typescript-template:该模板提供了一个精心设计的启动项目,用于使用React组件构建交互式AI应用(MCP Apps),并利用TypeScript、Tailwind CSS和Vite等现代Web技术。它展示了与ChatGPT等MCP主机集成的最佳实践,为服务器端工具和动态UI组件提供了全面的功能。

01

简评

ns-ui logo
ns-uiDev Tooling · ★ 34

将 UI 组件快速集成到现有的 Shadcn 配置的 React 项目中。

mcp-app-typescript-template logo
mcp-app-typescript-templateDev Tooling · ★ 21

为ChatGPT、Claude.ai和VS Code等MCP主机构建自定义交互式AI应用。

02

并排对比

字段
ns-ui logons-ui
mcp-app-typescript-template logomcp-app-typescript-template
分类
开发者工具
开发者工具
Stars
★ 34
★ 21
许可证
MIT
Apache-2.0
安装方式
npx shadcn init -d && npx shadcn add https://design.helpmarq.com/r/gallery-coverflow-caustic.json
git clone https://github.com/pomerium/mcp-app-typescript-template your-mcp-app && cd your-mcp-app && npm install && npm run dev
更新时间
2天前
2天前
开源
是
是
标签
React 组件, UI 库, Shadcn/UI
MCP, React, TypeScript
03

功能特性

ns-ui logons-ui
01通过 URL 直接安装组件,无需包依赖。
02使用 Playwright 对交互、可访问性和主题兼容性进行严格的自动化测试。
03安装后对组件源代码拥有完全所有权和可定制性。
04提供代理友好的目录 API(纯文本、MCP 服务器、CLI),用于程序化组件发现和安装。
05包含两个不同的组件集合:'core' 用于生产设计,'loud' 用于炫酷展示。
mcp-app-typescript-template logomcp-app-typescript-template
01带有应用助手的MCP服务器:使用`McpServer`和MCP应用助手的Node.js服务器,用于强大的后端开发。
02带有App API演示的React组件:交互式React组件演示了MCP Apps `App` API,用于与主机通信。
03UI能力协商:服务器自动检测主机能力并调整响应,支持UI和纯文本客户端。
04内联组件资源:支持针对iframe沙盒主机(如Claude.ai)或远程共享的自包含HTML模式。
05用于测试的模拟应用:包含`createMockApp()`辅助函数,用于在没有实时MCP连接的情况下进行本地测试和Storybook开发。
04

使用场景

ns-ui logons-ui
↳将 UI 组件快速集成到现有的 Shadcn 配置的 React 项目中。
↳使用经过严格测试的组件构建交互式且视觉吸引力的 Web 界面。
↳使 AI 代理或自动化脚本能够以编程方式发现和安装 UI 组件。
↳建立高度可定制的设计系统,完全控制单个组件的源代码。
mcp-app-typescript-template logomcp-app-typescript-template
↳为ChatGPT、Claude.ai和VS Code等MCP主机构建自定义交互式AI应用。
↳在AI聊天界面中将服务器端工具与动态前端组件集成。
↳使用强大的现代Web开发堆栈进行MCP应用的快速原型设计和开发。
↳使用`createMockApp()`和MCP Inspector等专用工具进行MCP应用功能的本地测试和调试。
↳使用多阶段Docker构建和全面的生产清单部署生产就绪的MCP应用。
FAQ

常见问题

ns-ui 和 mcp-app-typescript-template 有什么区别?
ns-ui 和 mcp-app-typescript-template 都属于 Dev Tooling 类别。ns-ui 有 34 Stars,mcp-app-typescript-template 有 21 Stars。
ns-ui 和 mcp-app-typescript-template 哪个更好?
最佳选择取决于你的具体需求。将 UI 组件快速集成到现有的 Shadcn 配置的 React 项目中。 时选 ns-ui,为ChatGPT、Claude.ai和VS Code等MCP主机构建自定义交互式AI应用。 时选 mcp-app-typescript-template。
ns-ui 是免费的吗?
是的,ns-ui 在 GitHub 开源(MIT)。
mcp-app-typescript-template 是免费的吗?
是的,mcp-app-typescript-template 在 GitHub 开源(Apache-2.0)。
推荐云部署
Ad

在 DigitalOcean 上一键部署

为你的 MCP 服务、Docker 容器与智能体提供即开即用云服务器,新用户立享 $200 免费额度(60天有效)。

立即领取 $200 免费额度
→

相关链接