团队总结

从可演示到可交付：AI Code 团队软工实践总结

团队名称：三傻大闹天庭
团队成员：黄耿标（后端）、林润鑫（前端）、梁桓铭（前端）
项目名称：AI Code 多智能体驱动的低代码应用生成平台
关键词：闭环、协作、工程化、成长

如果要用一个词概括这个学期，我们想用“闭环”。一开始，我们对软件工程的理解还停留在“把功能写出来”；到最后，我们慢慢意识到，一个课程项目真正困难的地方，不只是某个接口、某个页面、某个算法，而是能不能把需求分析、任务拆解、前后端联调、测试修复、答辩展示和最终部署连成一条能跑通的链路。

我们的项目是 AI Code 多智能体驱动的低代码应用生成平台。用户输入自然语言需求后，平台通过 AI 工作流生成代码，前端实时展示生成过程，并支持预览、局部选区编辑、源码下载和部署。项目核心链路可以概括为：

输入需求 -> AI 对话生成代码 -> 实时预览 -> 局部选区编辑 -> 下载源码 / 一键部署

这条链路看起来很短，但我们走了一个学期才真正理解它背后的工程含义。

项目最终版本

• GitHub 仓库：https://github.com/ye-qian26/SoftWareEngineering24.git
• 项目目录：ai-code
• 后端技术栈：Spring Boot、Maven、MyBatis Flex、MySQL、Redis、LangChain4j、LangGraph4j
• 前端技术栈：Vue 3、TypeScript、Ant Design Vue、Pinia、Vite、Axios

本次博客给出本地最终可运行版本的启动方式

本地运行方式

1. 准备环境

   • JDK 21 或兼容版本
   • Maven
   • Node.js 与 npm
   • MySQL
   • Redis
   • DashScope 相关环境变量：DASHSCOPE_BASE_URL、DASHSCOPE_API_KEY、DASHSCOPE_MODEL

2. 启动后端

   cd SoftWareEngineering24/ai-code
   mvn spring-boot:run
   

   后端默认端口为：

   http://localhost:8081/api
   

3. 启动前端

   cd SoftWareEngineering24/ai-code/ai-code-frontend
   npm install
   npm run dev
   

   前端默认访问地址为：

   http://localhost:5173
   

4. 构建检查

   cd SoftWareEngineering24/ai-code
   mvn -q -DskipTests package
   
   cd ai-code-frontend
   npm run build
   

一、学期回顾

1.1 对软件工程课程的想象与现实

刚开始接触这门课时，我们对软件工程的想象比较直接：有一个题目，分配一下任务，各自写代码，最后把结果拼起来。真正做下来之后，才发现软件工程最重要的并不是“写得快”，而是能不能把复杂任务拆清楚、把接口约定讲清楚、把风险提前暴露出来。

这个学期里，课程基本达到了我们最初的期待。我们不只是完成了一个 Web 项目，还经历了需求讨论、原型设计、技术选型、前后端分工、冲刺计划、答辩展示和最终总结。尤其是在冲刺阶段，我们从“功能分散、稳定性不足、体验不统一”的状态，逐渐推进到“需求输入 -> 代码生成 -> 页面预览”的主流程闭环。

不足也很明显。我们的自动化测试覆盖仍然不够，很多回归验证依赖人工操作；复杂输入下的 AI 生成质量还有波动；部署与运维经验也不够成熟。这些不足让我们意识到，软件工程不是一次性把项目做完，而是持续让系统变得更稳定、更可维护。

1.2 投入与产出

代码量按最终项目目录和成员职责估算，主要统计 ai-code 后端源码与 ai-code-frontend/src 前端源码，不包含 node_modules 等依赖目录。

成员	角色	主要负责内容	代码量估算
黄耿标	后端	后端架构、AI 编排链路、SSE 接口、用户与应用模块、数据模型、限流与监控	约 10050 行
林润鑫	前端	前端架构、首页、AI 对话页、状态管理、应用展示、加载/失败状态	约 2700 行
梁桓铭	前端	实时预览、选区编辑、组件复用、样式统一、部署反馈与联调修复	约 2000 行

各次作业花费时间为团队复盘后的估算：

作业	黄耿标	林润鑫	梁桓铭
第一次团队作业	5h	4h	4h
第二次团队作业	8h	7h	7h
第一次团队项目作业	12h	10h	10h
第二次团队项目作业	18h	16h	15h
第三次团队项目作业	25h	22h	20h
第四次团队项目作业	32h	28h	26h

成员	累计时间	实际周均时间	预计周均时间
黄耿标	100h	8h	6h
林润鑫	87h	7h	6h
梁桓铭	82h	6.5h	6h

1.3 印象最深的一次作业或答辩

最让我们印象深刻的是冲刺总结。冲刺周期是 2026 年 5 月 10 日至 2026 年 5 月 24 日，那段时间我们第一次强烈感受到“软件项目是会长出管理成本的”。

中期时，实际进度明显慢于理想进度：接口字段没有完全统一，前端联调经常因为返回结构变化而返工；复杂提示词下的生成结果不稳定；页面缺少加载态和失败态，演示时很容易让用户不知道系统正在做什么。后来我们把问题分成“规范、质量、体验、定位”四类：后端统一 code/message/data 返回结构，增加日志和错误码；前端补齐加载、空状态、失败提示；联调时按主流程优先处理问题。最后进度被追平，主流程也完成了闭环。

这场冲刺让我们明白：能演示不代表能交付，能交付必须依赖规范、沟通和持续修正。

二、总结收获

2.1 我们的软工实践故事

第一次真正讨论产品时，我们的想法很大：自然语言生成应用、实时预览、局部修改、一键部署、后台管理都想做。但课程推进后，我们逐渐学会把“愿景”拆成“主流程”和“增强功能”。冲刺阶段，我们把目标收敛为先打通“需求输入 -> 代码生成 -> 页面结果展示/预览”，其他功能围绕主流程服务。

后端最大的挑战是 AI 生成链路并不是普通 CRUD。黄耿标需要处理 Prompt 增强、生成类型路由、SSE 流式返回、代码质量检查、项目构建和部署下载等环节。刚开始调试时，一旦生成失败，前端只看到等待或中断，很难定位问题。后来通过统一异常、增加关键日志、保留对话历史和结构化错误事件，问题定位效率才明显提升。

前端最大的挑战是把“AI 正在生成”这件不确定的事变成用户能理解的界面。林润鑫负责的对话页和状态管理，需要处理消息增量渲染、历史对话加载、登录态维护和应用列表展示；梁桓铭负责的预览和选区编辑，则需要考虑 iframe 预览、元素选择、上下文拼接、部署弹窗和样式一致性。前端工作让我们认识到，体验不是最后加一点样式，而是从流程设计开始就要考虑用户每一步看到什么、能做什么、出错后怎么恢复。

在协作上，我们也经历了从“各写各的”到“先约定再开发”的变化。接口字段、路由路径、错误码、状态含义，如果没有提前讲清楚，联调时一定会还回来。后来我们更习惯先把接口、页面状态和验收方式说清楚，再进入开发。

2.2 学到的新技术与生产力工具

• Spring Boot + MyBatis Flex：帮助后端快速组织用户、应用、对话历史等业务模块，让数据库访问和接口开发更规范。
• LangChain4j + LangGraph4j：让 AI 生成从单次调用升级为多节点工作流，支持 Prompt 增强、类型路由、质量检查和项目构建。
• SSE 流式输出：让 AI 生成过程可以实时展示，减少用户等待时的不确定感，也提升了产品演示效果。
• Vue 3 + TypeScript + Pinia：提升前端组件化和状态管理能力，让登录态、应用列表、对话消息等数据更容易维护。
• Ant Design Vue：帮助我们快速搭建统一的表单、表格、弹窗和后台管理页面。
• Vite：提升前端开发和构建效率，热更新让页面调试更顺畅。
• Postman 与浏览器开发者工具：用于接口调试、请求排查和联调验证，是冲刺阶段使用频率最高的工具之一。
• Git 与 GitHub：让我们真正体会到版本管理的重要性，也让任务拆分和代码追踪更有依据。

2.3 技术之外的提升

• 沟通能力：前后端联调让我们学会把问题描述清楚，而不是只说“接口坏了”或“页面不对”。
• 计划意识：冲刺计划让我们意识到，项目不能只靠热情推进，需要有任务拆解、优先级和阶段目标。
• 风险意识：AI 生成质量、接口变更、部署环境、演示稳定性都可能成为风险，需要提前准备兜底方案。
• 复盘能力：每次答辩和总结都迫使我们回头看做得好的地方和没做好的地方，而不是交完作业就结束。
• 团队责任感：三个人负责不同模块，但最终呈现的是同一个项目。任何一个环节掉链子，都会影响整体体验。

三、成员学期回顾

黄耿标：从“能写接口”到“能撑起流程”

一开始我对软件工程课的期待，是通过课程项目把后端知识真正用起来。这个目标基本达到了，甚至比预想中更难。以前写后端时，我更关注接口能不能返回正确数据；这次项目里，我还要考虑 AI 生成链路、流式输出、异常处理、日志追踪、权限控制、缓存和限流。

我负责后端架构与核心实现，包括用户模块、应用模块、对话历史、AI 生成接口、SSE 输出、多智能体工作流、下载与部署等。最深的体会是：后端不是只给前端提供数据，更要保证整个系统在出错时有可追踪、可恢复的能力。冲刺阶段统一响应结构和错误码后，联调效率明显提升，这让我真正理解了“接口规范”的价值。

印象最深的是冲刺答辩前的联调。那段时间经常遇到 AI 结果不稳定、字段不一致、预览刷新异常等问题。解决问题的过程虽然很累，但也让我从单点编码转向系统思考。后续我还需要加强自动化测试、部署运维和底层原理理解，让后端能力更扎实。

林润鑫：前端不只是页面，而是用户理解系统的方式

这门课之前，我对前端的理解更多是页面实现和交互效果。做完 AI Code 后，我发现前端其实承担着“解释系统状态”的任务。AI 生成本身有等待、有失败、有不确定性，如果页面没有加载态、失败态和清晰反馈，用户很容易失去信心。

我主要参与前端架构搭建、首页、AI 对话页、应用展示、状态管理和部分后台页面开发。对话页是我印象最深的部分，因为它不是普通表单提交，而是要处理 SSE 增量消息、历史对话、生成完成后的预览刷新，以及用户继续追问的状态维护。这个过程让我更熟悉 Vue 3、TypeScript、Pinia 和 Axios，也更理解组件拆分和状态管理的重要性。

课程给我的提升不只是技术。团队协作中，我学会了在开发前先确认接口字段、路由路径和交互状态，减少返工。之后我希望继续补强前端工程化、性能优化和复杂交互设计，让自己不只是能写页面，而是能负责完整的前端体验。

梁桓铭：细节决定项目像不像一个产品

我原本以为前端工作主要是把页面做出来，但这次项目让我意识到，细节会直接决定一个系统像不像真正的产品。预览模块、部署反馈、选区编辑、样式统一，这些功能看起来不是最核心的 AI 生成算法，却决定了用户能否顺畅地完成一次完整操作。

我主要负责实时预览、选区编辑能力、组件复用、样式统一、前端异常兜底和联调修复。选区编辑让我印象很深：用户在预览页面中选中元素后，前端需要提取元素上下文，再把这些信息拼接进下一次提示词，帮助后端进行局部修改。这个功能让我意识到，前端也可以参与产品能力设计，而不是只负责展示。

通过这门课，我对 Vue 组件化、页面状态、前后端联调和工程化部署都有了更实际的认识。未来我还需要继续加强大型项目经验，尤其是复杂页面架构、浏览器渲染机制和前端底层原理。

四、项目不足与下一步

虽然项目已经完成主流程闭环，但我们也清楚看到一些不足：

1. 复杂输入下，AI 生成结果仍然存在波动，提示词策略和结果后处理还需要优化。
2. 自动化测试覆盖不够，尤其是前端端到端测试和后端核心流程回归测试。
3. 多人协同、版本对比、历史记录等高频功能还可以继续完善。
4. 部署与运维能力仍偏课程项目水平，后续需要补齐更稳定的线上环境与监控告警。

下一步，我们希望继续围绕“生成质量、工程稳定性、产品易用性”推进，把项目从“可用”进一步做到“好用、稳定、可扩展”。

五、致谢

首先感谢老师这一学期的指导。每次作业要求、答辩反馈和阶段提醒，都让我们不断把项目往更完整的方向推进。尤其是在冲刺阶段，老师对计划、燃尽图、测试、部署说明等内容的要求，让我们意识到软件工程关注的不只是代码结果，还包括过程管理和可复现交付。

也感谢团队里的每一位成员。黄耿标承担了后端主链路中最复杂的部分，很多联调问题都是靠后端日志和接口调整一点点定位出来的；林润鑫在前端主页面和状态管理上投入了大量时间，让项目从“能跑”逐渐变成“能用”；梁桓铭在预览、选区编辑和体验细节上不断打磨，让项目更接近一个完整产品。

这个学期并不轻松，但回头看，从第一次讨论想法，到最后能把项目跑起来、讲清楚、总结出来，我们确实走过了很多山。轻舟已过万重山，下一段路还会继续。