上门基础服务程序

单元名称实训八TraeWorkCode模式开发上门服务程序授课日期学时数2学时（90分钟）授课班级授课地点教材及参考资料《人工智能：AIGC基础与应用（第二版）》、配套教学课件、实训任务书及教学案例素材学情分析知识技能基础学生已完成前序模块与实训的学习，掌握AIGC工具与智能体应用的基本方法；对软件开发流程有一定了解，具备使用AI辅助编程工具（Trae等）的基本操作基础，但对WampServer等环境配置与代码调试经验较少。学情分析认知实践能力学生对新奇的AI辅助编程方式兴趣浓厚，动手意愿强；但对需求分析、后端验证逻辑等抽象概念理解较慢，调试bug时的自主排查能力有待培养。学情分析学习特点学生喜欢“通过对话让AI写代码”的直观方式，乐于尝试；需引导其理解指令描述与代码生成的对应关系，培养规范开发与安全意识。教学目标素质目标1.培养规范的软件工程意识，理解开发流程中的需求分析、设计与测试环节。2.培养精益求精的工匠精神，注重代码质量与界面体验。3.增强网络安全与数据保护意识，在开发中注意用户信息安全。4.培养独立调试与解决问题的能力，以及团队协作精神。教学目标知识目标1.掌握WampServer的安装配置与项目目录结构建立方法，了解TraeCode模式下AI辅助编程的开发方式。2.理解登录注册页面的开发逻辑及后端验证逻辑。3.了解主流H5设计元素（服务金刚区、搜索框、广告位、底部Tab导航）的实现方法。4.掌握服务下单流程的设计、订单数据存储（CSV通用字段+JSON差异化字段）与业务逻辑实现；了解功能完善与系统优化方法。教学目标能力目标1.能够独立完成开发环境搭建与项目初始化，通过AI辅助完成登录注册功能开发。2.能够通过对话引导AI生成应用首页，实现服务金刚区、搜索框、底部导航等界面元素。3.能够实现上门做饭、上门喂宠等核心服务的下单流程与订单数据存储。4.能够完善订单管理、地址管理、弹窗提示、退出登录等功能并修复常见bug。教学重难点教学重点1.WampServer环境搭建与TraeCode模式开发流程2.登录注册页面及后端验证逻辑3.服务金刚区等首页设计元素4.服务下单流程与订单数据存储方案。教学重难点教学难点1.理解AI辅助编程中指令描述与代码生成的对应关系2.订单数据通用字段与差异化字段的存储设计3.调试并修复下单、数据写入等环节的bug。教学内容①WampServer环境搭建与项目目录结构建立，TraeCode模式下生成登录注册页面及后端验证逻辑；②AI辅助生成应用首页，实现服务金刚区（9项服务）、搜索框、广告位、底部Tab导航；③上门做饭、上门喂宠核心服务的下单流程与订单数据存储（CSV通用字段+JSON差异化字段）；④完善订单管理、地址管理、弹窗提示、退出登录等功能并修复常见bug。教学策略教学组织采用“项目化教学+任务驱动+示范演示”组织教学，以开发上门服务程序为主线，按四个任务依次推进，教师示范AI辅助编程的关键流程，学生按实训任务书独立实操，教师巡回指导并组织成果展示与互评。教学策略教学方法项目化教学法、示范演示法、任务驱动法、巡回指导与问题导向法。教学准备学生课前预习内容预习实训任务书，回顾软件开发的基本流程；准备Trae编程工具账号，了解WampServer的作用。教学准备教学环境准备实训机房，准备投影设备与联网计算机（每生一台）、WampServer安装包、Trae编程工具可正常访问，浏览器调试工具可用。教学准备教学资源准备多媒体课件、实训任务书、上门服务程序参考素材（界面设计示例、订单数据结构示例）、实训评价量表。教学评价结合学生实训操作过程与成果完成情况进行评价。评价内容包括：四个任务的完成度（环境搭建与登录注册、首页设计、下单流程、功能完善）、程序运行效果与功能完整性、界面质量与代码规范性、网络安全与数据保护意识。学生总得分=30%×学生自评得分+70%×教师评价得分。教学实施过程（1-2课时）教学环节教学内容教师活动学生活动设计意图任务导入（5min）情境导入：展示一个“上门做饭/上门喂宠”服务程序的效果图，提问：这样一个包含登录、下单、订单管理的服务程序是如何开发出来的？展示服务程序效果图，说明本实训四个任务的目标与要求，引出AI辅助编程的新方式。观看效果图，思考服务程序的开发过程，明确实训任务。通过情境导入让学生了解AI辅助开发服务程序的价值，激发实训兴趣。示范讲解（25min）①任务一：环境搭建与登录注册；②任务二：首页设计与服务展示；③任务三：服务下单与业务逻辑；④任务四：功能完善与系统优化。示范安装配置WampServer、建立项目目录结构，在TraeCode模式下通过自然语言生成登录注册页面及后端验证逻辑；示范生成应用首页，实现服务金刚区（9项服务）、搜索框、广告位、底部Tab导航；示范上门做饭、上门喂宠下单流程与订单数据存储（CSV通用字段+JSON差异化字段）；示范完善订单管理、地址管理、弹窗提示、退出登录等功能并修复常见bug。认真观看示范，记录AI辅助编程的指令描述方法与调试技巧。通过示范讲解让学生掌握AI辅助开发服务程序的完整流程，为独立开发提供指导。学生实操（40min）学生按任务书完成任务一至任务四，并进行运行测试与整体优化。巡回指导，引导学生理解指令描述与代码生成的对应关系；提醒网络安全与用户信息保护；组织同伴互助，帮助调试常见bug。完成任务一至任务四：完成环境搭建与登录注册功能；生成首页并实现服务金刚区等元素；实现两项核心服务的下单与数据存储并测试；完善功能并修复bug，进行整体优化。通过独立实操让学生掌握AI辅助开发服务程序的完整流程，培养规范开发与调试能力。成果展示与点评（15min）学生在浏览器中演示运行效果（注册登录、首页浏览、下单、订单管理）。组织学生展示成果，共同点评功能完整性、界面效果与代码质量，交流AI辅助编程经验。在浏览器中演示运行效果，参与互评交流，学习他人的界面设计与功能实现。通过成果展示与互评，巩固AI辅助开发技能，提升软件工程质量意识。总结提升与作业（5min）总结AI辅助开发上门服务程序的完整流程，布置课后作业。总结要点，强调需求分析与测试的重要性；布置课后作业：选做实训拓展任务（增加更多服务类型、完善订单管理功能、优化界面体验等），整理实训报告。记录要点，明确课后作业要求。总结提升，引导学生思考AI辅助编程对软件开发方式带来的变化。教学反思教学效果学生均能完成四个实训任务，开发出可运行的上门服务程序，掌握AI辅助编程的基本流程，对登录注册、首页设计、下单流程与订单存储有了实