AIGC赋能的Web前端开发教学实践.pdfVIP

第10期计算机教育

2024年10月10日ComputerEducation153

人工智能赋能教学

文章编号：1672-5913(2024)10-0153-06中图分类号：G642

AIGC赋能的Web前端开发教学实践

项若曦，赵慧周，王桢廷，李吉梅

（北京语言大学信息科学学院，北京100083）

摘 要：针对AIGC在计算机教学中应用较多但辅助前端开发教学较少的现状，提出一种AIGC赋能、

人机协同的Web前端开发教学模式，通过测试在线大语言模型在Web前端开发教学中的应用场景，

分析其在各个方面辅助编程的能力，并从教师视角进行效果评估，最后说明AIGC赋能、人机协同的

Web前端开发教学模式可以有效地丰富课堂形式、提升教学效果。

关键词：人工智能；AIGC；大语言模型；Web前端开发；人机协同；教学模式

0 引 言过自然语言以聊天的方式与用户交互，高效、便

捷地生成用于编程教学的内容。

近年来，以ChatGPT为代表的生成式人工智同是编程学习，程序、算法类课程侧重于编

能技术展现了巨大的影响力，国内外众多大语言程思维和逻辑分析，而Web前端开发类课程则主

模型也如雨后春笋般涌现。在教育领域，AIGC要涉及HTML、CSS、JavaScript等前端技术，重

的诞生既是机遇也是挑战，引起了学者们的广泛点在于理解布局、输入、事件驱动、事件处理、

关注。董艳等人探讨了AIGC技术赋能教育对教输出等概念，以及对前端技术的综合运用，采用

学的影响，分析了其技术原理、辅助教学的形式的教学方法也更注重项目实践和即时反馈，适合

和方法、教育风险、伦理问题、局限性，以及对初学者入门并快速看到学习成果，进阶的Web前

教育生态和系统的影响[1]。在AIGC辅助计算机端开发则更是要融入学习者的创意和美学。为

教学方面，有学者实证探讨了利用AIGC技术实Web前端开发类课程引入AIGC有三大优势：

现计算机基础教学的方式，例如，在Python程①Web前端开发内容直观，使用AIGC技术能

序设计等编程教学中的应用等[2-4]。然而，目前够快速看到效果，提升学生学习的兴趣和效率；

关于AIGC辅助前端开发教学的研究较少，我们②Web前端开发重复性工作较多，使用AIGC技

需要思考：如何将其融入Web前端开发教学？术可以有效减少重复性工作，使学习者将更多

它对Web前端开发教学有哪些影响及其在辅助时间专注于解决复杂问题和创新上[5]；③相对程

课堂教学方面的能力如何？序、算法类的课程，Web前端开发类课程更注

重个性化、创意美学设计，而AIGC能提供较为

1 AIGC赋能Web前端开发教学概述成熟的开发方案、完善的设计建议和代码生成支

持。然而，使用AIGC新技术需要得到正确的引

基于预训练的大语言模型的AIGC技术展示导，否则容易引起学习者思路混乱，还会使学习

出了强大的语言理解能力和语境感知能力，能通者产生如过度依赖、技术和道德风险等问题[6]。

基金项目：全国高等院校计算机基础教育研究会计算机基础教