AI编程实战：7天从零搭建完整网站的全流程拆解

引言：一个人真的能顶一个团队吗？

不聊概念，不刷新闻，直接动手做一个完整项目——这是验证AI开发能力最直接的方式。一位开发者用7天时间，全程借助AI工具（Claude Code + DeepSeek），从零完成了一个国漫内容展示网站的开发、数据生成和上线部署。代码99%由AI编写，数据由AI生成，甚至每一张配图都是通过MCP调用豆包C-Dream自动生成的。

这个实战案例不仅展示了AI编程的真实能力边界，更暴露了过程中的关键坑点。以下是完整的7步拆解和经验总结。

第一步：用DeepSeek做需求规划

项目的起点不是写代码，而是和AI聊想法。作者先与DeepSeek进行多轮对话，逐步明确网站的具体功能、页面设计和技术选型。

技术背景：Claude Code与DeepSeek的分工逻辑 Claude Code是Anthropic推出的面向开发者的AI编程助手，其核心优势在于对复杂代码库的理解能力和多步骤任务的自主规划能力。与普通代码补全工具不同，Claude Code能够理解项目整体架构，并在执行过程中自主调用工具、运行命令、验证结果。DeepSeek则是深度求索公司推出的大语言模型系列，以极高的性价比著称——其V4 Pro版本在推理能力上对标国际顶尖模型，而价格仅为同类产品的数分之一。两者组合使用，形成了"规划用DeepSeek、执行用Claude Code"的分工模式，充分发挥各自优势。

整个规划过程分为四个阶段：

1. 聊想法：DeepSeek给出大概方案和建议
2. 聊功能：明确告诉AI网站的具体功能，让它做详细规划
3. 聊设计：可以自己提想法，也可以从AI提供的多套方案中选择。DeepSeek虽然不能直接生图，但能给出基本的布局线稿
4. 聊技术：确定技术选型和架构设计

最终，AI输出了一份完整的需求设计文档。这份文档的质量直接决定了后续开发的顺畅程度——这也是整个项目最重要的经验之一。

第二步：Claude Code接力开发

有了需求文档，开发阶段就变得相对简单。将完整的需求设计文档粘贴到Claude Code中，它会调用DeepSeek V4 Pro模型进行思考、规划任务，然后逐步开发。

第一版：核心功能快速成型

作者只安装了几个本次项目可能用到的skill，Claude Code就自主决策调用了前端Nuxt相关的skill，完成了第一版开发。AI生成的代码结构层次清晰，前后端代码干净整洁，小改一下就完整跑起来了，功能也符合预期。

技术背景：为什么AI偏爱Nuxt这类主流框架 Nuxt是基于Vue.js的全栈Web框架，支持服务端渲染（SSR）、静态站点生成（SSG）和单页应用（SPA）多种模式，内置文件路由、数据获取、状态管理等功能，是当前Vue生态中最受欢迎的全栈解决方案之一。AI在本项目中自主选择Nuxt作为技术栈，体现了其对主流技术生态的感知能力——这类框架拥有大量公开文档和代码示例，恰好是AI训练数据的优质来源，因此AI在这类技术上的表现往往优于冷门框架。这也从侧面说明：选择主流、文档完善的技术栈，是AI辅助开发项目中降低风险的重要策略。

有意思的是，开发过程中AI会自测，至少保证接口调用成功。这意味着AI不只是"写代码"，而是具备了一定的工程意识。

第二版：功能扩展与踩坑

第二版加入评论功能也很快搞定。但在接入阿里云短信认证和图形验证时，花了大量时间。核心原因是没有给AI提供官方文档和示例代码，导致AI开始"自由发挥"，生成了大量不符合实际API规范的代码。

深度解析：AI的"幻觉"问题与工程应对 AI在接入阿里云短信认证时出现的"自由发挥"问题，本质上是大语言模型的"幻觉"（Hallucination）现象在工程场景中的具体表现。当模型训练数据中缺乏某个API的准确信息时，它会基于相似模式进行推断，生成看似合理但实际不符合规范的代码。这在私有API、新发布接口或文档不完善的服务中尤为突出。业界的应对方案包括：RAG（检索增强生成）技术——将官方文档实时注入上下文；Few-shot提示——提供真实可运行的示例代码；以及工具调用验证——让AI在生成代码后立即执行并根据错误信息自我修正。本项目的经验印证了一个普遍规律：AI的输出质量上限，由你提供的上下文质量决定。

这是一个非常典型的教训：AI的能力边界取决于你给它的上下文质量。

第三步：数据生成——写代码不难，难的是数据

这个项目的一大亮点是：文本和图片数据全部由AI生成，没有使用任何外部爬取的数据。

• 文本数据：靠AI自身知识体系生成后直接写入数据库
• 图片数据：通过MCP调用豆包C-Dream生成，按约定好的名称和路径存储，同时更新数据库

技术背景：MCP协议——让AI调用AI的标准化桥梁 MCP（Model Context Protocol）是Anthropic于2024年底发布的开放协议，旨在标准化AI模型与外部工具、数据源之间的交互方式。通过MCP，AI助手可以像调用函数一样调用外部服务，极大扩展了其能力边界。豆包C-Dream是字节跳动旗下的AI图像生成服务，支持通过API进行批量图像生成。在本项目中，Claude Code通过MCP协议直接调用豆包C-Dream，实现了"AI指挥AI生成图片"的自动化流水线——这代表了当前AI工具链集成的前沿实践，也是所谓"AI Agent"落地应用的典型形态。随着MCP生态的不断扩展，越来越多的服务正在接入这一协议，AI的工具调用能力边界也在持续拓宽。

大批量生成时，AI自动编排、自动重试。遇到敏感词会自己替换，直到成功为止。这种自动化的容错机制，体现了当前AI工具链的成熟度。

Token消耗与成本分析

整个项目的Token消耗数据非常有参考价值：

阶段	时间	Token消耗	费用
环境搭建+核心开发	第1-4天	约1.2亿	不到7元
数据生成	第5天	约5000万	约5元
调试+上线	第6-7天	约1.5亿	较高

几个关键发现：

• DeepSeek V4 Pro在2.5折优惠下，1.2亿Token的开发成本不到7元，性价比极高
• 第5天生成数据时忘了切换到DeepSeek V4 Flash，白白多花了钱
• 后期1.5亿Token的消耗主要源于上下文污染和反复调试，这是最大的成本黑洞

深度解析：Token经济学与上下文污染的技术机制 Token是大语言模型处理文本的基本单位，中文通常1-2个字对应1个Token。上下文窗口（Context Window）是模型单次能处理的最大Token数量，当前主流模型通常在32K到200K Token之间。"上下文污染"是指随着对话轮次增加，历史对话中的错误信息、无效尝试和矛盾指令被持续纳入模型的参考范围，导致模型输出质量下降、方向偏移。这是长对话开发场景中最常见的效率杀手。从工程角度看，解决方案包括：定期开启新会话、手动提炼关键上下文摘要、使用支持会话管理的工具等。本项目后期1.5亿Token的消耗，很大程度上正是为这种"上下文熵增"付出的代价——理解这一机制，是控制AI开发成本的关键所在。

四条核心经验总结

经验一：需求文档越完整，AI越靠谱

花时间和DeepSeek把需求、设计、技术架构聊透，后面Claude Code开发就是水到渠成的事情。前期偷的懒，后期都会加倍偿还。

经验二：给AI文档和示例，它就不会自由发挥

阿里云认证那段折腾最久，原因就是没给官方文档。后来补上文档和示例代码，问题很快解决。AI不是万能的，它需要正确的参考资料。

经验三：警惕上下文污染

后期1.5亿Token就是被上下文污染烧掉的。当对话轮次过多、上下文中混入了错误信息时，AI的输出质量会急剧下降。建议遇到复杂问题时开新会话，重新给关键上下文。

经验四：模型要选对，该省则省

DeepSeek V4 Pro适合复杂推理任务，但简单的数据生成、格式转换等任务，切到Flash版本能省不少钱。工具选择本身也是一种工程能力。

结语：AI编程的真实状态

这个案例清晰地展示了当下AI编程的真实水平：一个人、一个想法、七天时间，就能完成一个包含前后端、数据库、认证系统、内容生成的完整网站。

但同时也要看到，AI并非万能。它在有清晰文档和上下文的情况下表现优异，但一旦缺少参考资料或上下文被污染，就会陷入低效的反复试错。

AI不是取代开发者，而是让一个人能顶一个团队。关键在于学会和AI协作——给它清晰的指令和正确的上下文。这或许就是未来开发者最核心的能力。

核心要点

• 全程使用Claude Code + DeepSeek，7天完成一个完整网站的开发、数据生成和上线部署，代码99%由AI编写
• 需求文档的完整度直接决定AI开发质量，前期与AI充分沟通需求、设计和技术架构是成功关键
• 给AI提供官方文档和示例代码可以避免其"自由发挥"，阿里云认证的踩坑经历是典型反面教材
• 上下文污染是最大的成本黑洞，后期1.5亿Token消耗主要源于此，建议复杂问题开新会话处理
• DeepSeek V4 Pro在2.5折优惠下，1.2亿Token开发成本不到7元，但需根据任务复杂度选择合适模型以控制成本