核心要点
- Callnovo开源了一套全栈vibe-coding模板，能够从自然语言提示构建生产级Web应用 —— 模板内含20个专项技能和3个专家智能体，适配Claude Code，覆盖从数据库设计到安全审计再到部署的全流程。
- 我们构建它是因为内部需要快速迭代——AI辅助开发让我们在几天内交付了过去需要几周的工具 —— 包括我们基于Bitdefender API构建的安全管理层、客户入驻仪表盘，以及运营报表工具。
- 这不是一个业余项目——这是一家2,500+客服的BPO公司保持竞争力的方式 —— 当运营经理周五之前需要一个新仪表盘时，你要么自己建，要么买一个不太合适的。我们选择了自己建。
- 我们开源它，是因为AI开发工作流本身才是创新，而不是模板代码 —— 真正的价值在于团队如何组织AI编程工作流，我们认为更多公司应该采用这种方式。
一家会写代码的BPO公司
先回答一个显而易见的问题：一家客户服务外包公司为什么要在GitHub上发布开发者工具？
因为我们不仅仅是一家客户服务公司。Callnovo在菲律宾、哥伦比亚、玻利维亚等多个国家运营着2,500+名客服。我们自研了HeroDash——我们自己的全渠道联络中心平台。我们基于Bitdefender的API构建了定制化终端安全管理层。我们构建内部仪表盘、客户报表工具、质检自动化以及集成中间件。每周都有新的需求出现——而市面上没有现成的解决方案。
问题从来不是我们要不要写代码，而是如何在不牺牲质量的前提下更快地写。
模板到底是什么
Fullstack Vibe-Coding Template是一个为Claude Code——Anthropic的AI编程智能体——设计的项目脚手架。你不需要从空白仓库开始、手动配置Web应用的每一层，只需克隆模板、用自然语言描述你想构建的内容，Claude就会处理架构、UI、API、数据库设计和测试。
听起来像魔法？其实不是。真正的”魔法”在于模板.claude/skills/目录中内置的20个技能和3个专家智能体。
技能体系
每个技能都是一个结构化提示，编码了特定领域的最佳实践。当Claude遇到属于某个技能领域的任务时，会自动应用这些实践。
核心开发： 数据库Schema设计、后端API规范、测试（Vitest + Playwright）、版本控制、代码审查协议。
质量保障： 安全审计、性能优化、无障碍合规（WCAG）、依赖管理。
用户体验： UI设计系统（Tailwind CSS + shadcn/ui）、国际化（i18n）、数据可视化。
编排协调： 任务分析智能体，推荐应该应用哪些技能。持续改进系统，将你的工作模式沉淀为新的可复用技能。
技术栈
模板基于现代全栈技术构建：
- Next.js 14 配合 React 18 和 TypeScript
- Tailwind CSS 配合 shadcn/ui 组件设计
- Drizzle ORM —— 开发环境使用SQLite，生产环境使用MySQL
- Vitest 单元测试，Playwright 端到端测试
- 内置CI/CD 配置
我们实际如何使用它
接下来的内容，才是理解Callnovo这家公司的关键：这个模板不是一次营销活动，而是我们工程团队实际工作方式的提炼。
我们在解决的问题
当你在六个国家运营客户服务时，会源源不断地产生现成软件无法满足的运营需求：
- 玻利维亚的运营经理需要一个仪表盘，在同一个界面上展示客服出勤率、通话质量评分和客户专属SLA——还要对接五个不同的消息平台。
- 客户入驻团队需要一个工作流工具，追踪哪些终端已安装Bitdefender、哪些客服已完成培训、哪些账户已准备好上线。
- 客户成功经理需要从HeroDash提取报表数据，自动生成面向客户的周报。
这些都不是你能买到的产品。它们是连接平台、流程和人员之间的运营粘合剂。而在快节奏的BPO环境中，构建它们的时间窗口以天计算，而非季度。
识别运营缺口
运营经理、客户成功经理或客户反馈了一个工作流瓶颈或现有工具无法解决的能力缺失。描述需求
工程团队用自然语言描述期望的功能——需要什么数据、谁来使用、支持什么决策。AI辅助开发
使用vibe-coding工作流，Claude生成完整应用——数据库Schema、API路由、UI组件、测试——并内置质量检查。审查、部署、迭代
工程师审查产出、运行测试套件、部署到生产环境，并根据用户反馈迭代。整个周期：以天计，而非以周计。实际案例
我们的Bitdefender管理Web应用就是一个很好的例子。我们需要跨六个国家实现站点隔离的终端安全管理。没有任何现成产品能很好地处理单一组织管理分布式站点的场景。因此我们基于Bitdefender的GravityZone API构建了定制Web应用——站点级仪表盘、自动化合规检查、补丁策略执行和事件响应工作流。
同样的模式贯穿我们整个运营：
客户集成工具。 当客户系统与我们的平台没有原生集成时，我们自己构建中间件。Amazon Seller Central对接、Shopify订单数据管道、CRM同步工具——全部内部构建，全部针对客户特定需求定制。
质检与报表自动化。 HeroDash中的AI语音质检系统能实时分析通话并标记质量问题。当运营经理发现误判——比如一通三人参与的西班牙语通话被错误识别为愤怒客户——申诉处理流程就是我们为这类边缘场景专门构建的内部工具。
运营仪表盘。 每位运营经理的需求都不同。有些管理30人的大型项目，需要深度指标分析；有些同时管理40个账户的共享客服，需要完全不同的视图。现成的BI工具不理解BPO运营。我们的工具理解，因为是我们自己建的。
为什么要开源
我们并不打算成为一家开发者工具公司。开源这个模板有三个原因：
1. 工作流比代码更有价值。 模板本身只是一个脚手架——Next.js、Tailwind CSS、Drizzle ORM。没有任何专有技术。真正有价值的是这个模式：用领域专属技能来组织AI开发工作流，将组织的最佳实践编码其中。我们希望更多公司——尤其是像BPO这样的非科技公司——采用这种方式。
2. 开源倒逼我们保持质量。 代码开源意味着其他开发者会阅读它。这种问责机制让我们的内部实践保持锋利。如果安全审查技能达不到公开发布的水准，那它也达不到内部使用的水准。
3. 它展示了我们是怎样的公司。 当潜在客户询问我们的技术能力时，我们可以直接指向一个公开仓库，里面有20个生产级开发技能。这比PPT有说服力得多。
这对您意味着什么
如果你是开发者或小型团队，正在构建内部工具，这个模板能为你提供一个起跑优势。克隆它，描述你的需求，让Claude处理样板代码，你专注于业务逻辑。
如果你正在评估Callnovo作为BPO合作伙伴，这个模板是更深层能力的证明：我们投资工程能力，因为我们的运营依赖于此。 构建这个模板的团队，同样构建着管理你的客服、监控你的质量指标、对接你的系统的工具。
客户服务不是一个低技术含量的行业——至少在我们的规模上不是。那些把它当作低技术行业来经营的公司，它们的客户最终会找到我们。
来试试
模板已在github.com/callnovo-lab/fullstack-vibe-coding-template以MIT协议开源。克隆它，安装Claude Code，然后描述你想构建什么。
两个核心命令：
/just-do-it—— 分析你最近的改动，自动运行所有相关质量检查。/improve-skills—— 从已完成的工作中提取模式，沉淀为新的可复用技能，供未来项目使用。
随着内部工作流的不断优化，我们会持续迭代这个模板。欢迎贡献代码。
