还剩6页未读，继续阅读
文本内容:
从入门到实战》教学大纲«Vue.js
3.xVue.js前端开发框架技术/Vue.js Front-end DevelopmentFramework课程名称（中/英）Technology学分2总学时:48理论学时24实验学时24（含实战）课程类别专业课开课学期2适用专业软件工程、计算机科学与技术课程性质必修课先修课程HTML+CSS+JavaScript
一、课程简介Vue.js是目前流行的三大前端框架之一课程以Vue.js3为基础，重点讲解Vue.js的生产环境、开发工具、基础语法及生态系统，为学生搭建起通向“企业级应用前端开发”的桥梁和纽带，为学生在前端开发领域“深耕细作”奠定基础、指明方向课程将系统地讲授计算属性、监听器、内置指令、组件、过渡与动画、自定义指令、渲染函数、响应性与组合API、webpackVueRouterVuex、VueUI组件库等基础知识，并使用Vite、VueCLI等前端开发与构建工具开发一个Vue.js前端应用电子商务平台，为大型项目的前端开发打下坚实基础
二、课程目标
（1）知识目标课程目标1:理解Vue.js的基础知识及框架原理；课程目标2掌握基于Vue.js前端开发的主要过程、步骤和方法，针对企业级应用前端开发的实际问题，总结提炼相关的系统架构；课程目标3熟练使用VSCode、Vite、Vue CLI等开发与构建工具，构建基于Vue.js的前端应用开发；课程目标4撰写“Vue.js前端开发框架技术”课程作业、实验报告，能够查找和阅读Vue.js前端开发框架方面的国内外文献资料
（2）能力目标课程目标5:注重培养实践与实战能力，掌握基本的Vue.js前端开发框架创新方法和应用解决方案；课程目标6:研究与Vue.js前端开发框架相关的前沿理论与框架发展新动向，能够结合大数据、云计算等新兴技术，拓展面向新兴行业的前端系统整合开发；课程目标7:培养学生树立正确的思想意识，专业课程融入“思政教育”了解企业级应用前端开发过程中有关国家的经济、环境、法律、安全、健康、伦理等政策和制约因素；课程目标8:面向新工科建设，了解前端工程管理原理与经济决策方法，并能在企业级应用前端开发中进行应用；课程目标9:通过团体协作，小组讨论、翻转课堂等课程教学模式设置，使学生积极承担个体、团队成员以及负责人的多种角色；课程目标10:具有自主学习和终身学习的意识，不断学习Vue.js前端开发框架相关知识，适应新的发展领域
（3）课程目标与毕业要求的关系毕业要求指标点具体内容对应课程目标
1.专业知识具有独立获取知识、提出问题、分析问题和解决问题的基本
2、
4、
5、6能力及开拓创新的精神
2.问题分析与设计解决方案掌握Vue.js前端开发框架的基本理论、基
1、
2、3本知识和基础方法
3.思政培养具有人文社会科学素养、社会责任感，能够在实践与实战中
7、
8、9理解并遵守工程职业道德和规范，履行责任
4.自主学习能力具有较强的自学能力、一定的前端工程设计能力、分析
6、10解决前端工程实际问题能力
5.沟通能够就企业级应用前端开发方面问题与业界同行及社会公众进行
4、
8、9有效沟通和交流
6.使用现代工具具有较强的前端系统整合开发能力，能够运用软件工具进行前端工程项目的需求分析、设计、实现、测试、维护等工作
37.项目管理理解并掌握前端工程管理原理与经济决策方法，并能在多学
4、
5、
6、8科环境中应用
8.终身学习具有自主学习和终身学习的意识，有不断学习和适应发展的10能力
（4）教学内容安排总体思路由Vue.js基础入门到项目案例实战，具体内容安排顺序Vue.js3基础知识（计算属性、监听器、内置指令、组件、过渡与动画、自定义指令、渲染函数、响应性与组合API、webpack）―Vue.js3进阶知识（VueRouterVuex、VueUI组件库）一项目案例实战（电子商务平台的前端设计与实现）
三、教学内容及基本要求总学时96对应序号教学内容教学要求课程目讲实实标课验战
1.了解网站交互方式初始Vue.js,包括网站交互
2.理解MVVM模式的基本原理1方式、MVVM模式、Vue.js的
1001、
2、
53.掌握Vue.js的安装方法定义、Vue.js的安装方法以
4.理解Vue.js的生命周期及Vue.js的生命周期等内容2计算属性和监听器，包括
1.掌握计算属性computed和监
1101、
2、计算属性computed以及
3、
4、5听器属性watch的用法监听器属性watch等内容
2.理解计算属性和监听器属性的使用场景
3.熟练撰写实脸报告内置指令，包括v-bind、
1.掌握Vue.js的常用内置指令
1、
2、3v-if v-show v-for^v-on的用法
1203、
4、v-model等指令
52.熟练撰写实验报告
1.了解组件注册机制
2.掌握使用props进行父子组件传值
1、
2、组件，包括组件注册、组件
3.掌握组件通信的基本原理，包括
3、
4、4通信、插槽、动态与异步组
4205、
6、父子组件通信、兄弟组件通信、组件件等内容10链通信等场景
4.了解插槽的基本用法
5.了解动态与异步组件的实现方法
6.熟练撰写实验报告过渡与动画，包括单元素/组
1.掌握单元素/组件过渡的实现
1、
2、5件过渡、多元素/组件过渡以方式
1003、
4、及列表过渡等内容
2.掌握多元素/组件过渡的实现方式
53.掌握列表过渡的实现方式自定义指令，包括自定义指
1.掌握自定义指令的使用方法
1001、
2、令的注册机制、自定义指令
2.理解自定义指令的实现原理
3、
4、56的实现原理、自定义指令实
3.理解自定义指令的注册机制战等内容渲染函数，包括DOM树的基
1.掌握渲染函数的用法
1001、
2、
3、本概念、渲染函数的基本原
2.理解渲染函数的原理
4、7理、h函数的基本用法等内5容
2001、
2、
1.掌握setup函数的用法组合API与响应性，包括响
3、
4、
2.理解响应性原理与组合API思想应性的概念及原理、组合API
5、
883.理解响应式计算与侦听原理的原理、setup组件选项、提供/注入、模板引用、响应式计算与侦听等内容使用webpack,包括webpack
2001、
2、
1.掌握webpack的基本配置的安装与使用、加载器
3、
4、
2.了解webpack加载器与插件的配Loaders与插件Plugins、单
5、6置9文件组件与vue-loader等内
3.掌握使用webpack构建Vue.js应容用的具体过程
4.了解npm常用命令Vue Router,包括Vue Router
1.掌握如何使用VueCLI脚手架搭建
4201、
2、的安装、Vue Router的基本
3、
4、Vue.js项目10用法、Vue Router高级应用、
5、
6、
2.掌握Vue Router的基本用法、高路由钩子函数、
7、8级应用以及路由钩子函数的使路由元信息等内容用
3.了解网络安全机制
4.了解国家网络安全战略
5.熟练撰写实脸报告Vucx,包括状态管理与应用场
1.了解网络安全机制
2001、
2、景、Vuex的安装与基本应用、
2.了解国家网络安全战略
3、
4、Vuex的核心概念等内容
5、
6、
113.了解状态管理的应用场景
7、
84.掌握Vuex的安装与基本应用
5.掌握Vuex的核心概念VucUI组件库，包括setup语
1.掌握setup语法糖的使用方
4001、
2、法糖、ElementPlus、ViewUI
3、
4、法12Plus、Vant Uk其他UI组件
5、
6、
2.了解ElementPlus、ViewUIPhis、库等内容
8、10Vant等UI组件库的使用方法电子商务平台的前端设计与
1.掌握基于Vue CLI构建工具的实现，讲述如何使用VueCLI、Vue.js前端应用开发的流程、方法
2、
3、Vite等前端开发与构建工具以及技术栈
4、
5、13开发一个Vue前端应用，其中
2.掌握基于Vi（e构建工具的Vue.js
0506、
7、主要涉及的技术包括Vue、前端应用开发的流程、方法以及技术
8、10Vue Router、Element Plus、栈wcbpack、Vite、WcbStoragc
3.熟练撰写设计文档等前端技术
1.掌握基于Vue CLI构建工具的Vue.js前端应用开发的流程、方法
2、
3、以及技术栈分组（1-2人）设计并实现一
2.掌握基于Vite构建工具的Vue.js
4、
5、14个基于Vue.js3+Vue UI组前端应用开发的流程、方法以及技术
00126、
7、件库的前端应用系统栈
8、
9、
3.熟练撰写设计文档
104.加强团队协作，积极承担团队成员与负责人的多种角色合计241212
四、教学安排及教学方式
（1）教学安排总学时48学时，其中，讲授24学时，实脸（上机）16学时（见《Vue.js前端开发框架技术》实验教学大纲），案例实战8学时（见《Vue.js前端开发框架技术》课程实训资源）
（2）教学方式线上线下混合式教学，以课堂教学为主，辅以适当的线上学习、课堂提问、讨论、实验、实践、实战来强化学生对Vue.js前端开发框架技术的主要概念、基本原理、基本方法的理解与认识，以上机实验、案例综合实战与习题练习使学生充分认识到Vue.js前端开发框架技术在企业级应用前端开发的重要地位，通过上述教学活动来实现对学生理论联系实际解决复杂问题能力的培养讲授环节主要采用教师讲解、演示、互动的教学形式教师讲解知识点、演示程序代码，使学生对知识点形成直观印象，并通过课堂教学双方互相提问，与学生互动，鼓励学生在课堂上发表自己的见解，加深对知识点的理解，达到课程目标实验环节主要采用教师安排任务、学生自主上机练习，教师现场指导、答疑的形式上机练习可利用实验室电脑或学生个人电脑编程，通过安装在本地的IDE进行上机练习案例实战环节主要采用学生自主实战项目案例，教师线上线下指导、答疑的形式项目案例实战利用学生个人电脑编程，通过安装在本地的IDE进行实战
五、考核方式与成绩评定办法考试成绩由平时成绩和期末成绩两部分构成平时成绩占总成绩的40%,期末成绩占总成绩的60%,具体评分标准见下表
（1）平时成绩由课堂出勤表现、上机实脸（实战）、出勤成绩按相应的比例折算并相加后得出
（2）期末成绩由项目报告和期末项目答辩成绩折算得出考核方式及成绩占比为:序号成绩构成考核方式占比1课堂表现10%2平时成绩上机实验（实战）20%3出勤10%4项目报告10%期末成绮5期末项目答辩50%合计100%评价标准
（1）课堂表现课堂表现可通过回答问题、分组讨论、演讲汇报等方式进行考核，按照百分制评分，总评后按照10%进行折算评分标准为:评分观测点分分分分分80-10060-7940-591-39回答问题、参与积极主动回答不能正常地回能够被动回答问勉强能回答问题、不能回答问讨论或汇报情问题、参与讨答问题、参与讨题、参与讨论或参与讨论或做汇题、参与讨论况（权重
0.4）论或做汇报论或做汇报做汇报报或做汇报资料查阅、知识熟练查阅全部基本做到资料的能做到部分资料不能做到资料运用情况（权重资料、运用相查阅、知识的运的查阅、部分知的查阅、知识的
0.3）关知识用识的运用运用观点和想法的观点和想法观点和想法比较观点和想法比较没有明确的观表达（权重清晰、合理，明确，具有明确，但合点和想法
0.3逻辑性好一定的合理性、理性、逻辑性不逻辑性足
（2）上机实验（实战）上机实脸（实战）环节按照百分制评分，然后按照20%进行折算评分标准为评分观测点80-100分60-79分40-59分1・39分0分实脸（实践、按时完成，业务逻按时完成，业务后期补交，内容延时完成，业务逻实战）预习辑合理，内容完整；逻辑基本合理；不完整，不能辨辑基本合理；勉强报告（权重能积极、正确回答能正确回答教师识；不能回答教未提交能回答教师提出的
0.2）教师提出的问题提出的问题师提出的问题问题操作IDE不够熟操作IDE生疏，操实脸（实践、操作IDE熟练，操练，有少量错误作有错误但不违法操作生疏，未能缺席或违实战）操作作方法正确，实验但不违法安全规安全规程，能够得完成实脸，未能反安全规（权重
0.4）效果合理程，实验效果合出实脸效果得出实睑效果程理实睑（实践、实战）总结按时完成，内容全按时完成，内容延时完成，内容基后期补交，内容报告未提交面；基本完整本完整不完整（权重
0.4）
（3）出勤出勤按照百分制评分，然后按照10%进行折算评分标准为满分100,旷课1次扣5分，请事假1次扣3分，请病假1次扣2分，迟到1次扣2分，早退1次扣2分
（4）项目报告项目报告按照百分制评分，然后按照10%进行折算评分标准为:评分观测点分分分分分80-10060-7940-591-390文字通顺，逻揖文字基本通顺，文字通顺，逻辑文字不够通顺，性较好，结构合逻辑性一般，结性好，结构合理，逻辑性差，结构项目报理，数据库设计构有不合理部分，数据库设计合理，一般，抄袭较多，未提交告撰写合理，功能模块数据库设计不合功能模块实现完无自己实现的模实现完整，但抄理，功能模块实整块袭较多现不完整，抄袭较多
（5）期末项目答辩期末项目答辩采用百分制评分，总评后按照50%进行折算评分标准为:分值分配/分值指标分值指标分配备注分档分档1:项目业务逻辑合理，网站功能齐全，页面视觉美10—20分观分档2:项目业务逻辑基本合理，网站功能基本齐全，页按照项目整体结构和个5—10分面有美化人完成部分质量情况，完成质量20按个人给分（注项分档3:业务逻辑简单，页面简陋，项目功能不完整目中的成员成绩不同）1-5分档4:不是由个人独立完成分0分个人工作量完成项目中组员的平均工作量（注分档1整个项目由1人独立完成，可以考虑额外多加1030分分，注如果最后总分超过100,则以100处理）注分档2:个人工作量完成超过到平均工作量的1/2,具体由
1.要求项目业务逻辑功15-30分答辩老师按照完成量酌情给分能实现合理如果项目工作量30功能不齐全或功能不合理，则酌情扣分分档3:15分个人工作量完成项目中组员的平均工作量的l/2o
2.不满足备注中的项目分档4:个人工作量完成不到平均工作量的1/2,具体由答要求一条小组扣4分0-15分辩老师按照完成量酌情给分项目中没有个人独立完成的部分0分分档5:注经答辩老师确认个人工作量不是本人完0分成分档1能准确流利地回答5个难度适宜的问题以上，回40—50分答问题时思路清晰，言简意赅，重点突出，准确无误分档2:能准确流利地回答3个难度适宜的问题以上，回30—40分答问题时思路清晰，言简意赅，重点突出，准确答辩50无误分档3:能准确流利地回答1个难度适宜的问题以上，回20—30分答问题时思路清晰，言简意赅，重点突出，准确无误分档4:回答问题时思路混乱，重点不够突出，表达不够0—20分准确，错误百出
六、教材及其他教学资源
（1）使用教材川陈恒.Vue.js
3.X从入门到实战微课视频版.北京清华大学出版社,
2023.2主要参考书川陈恒.SSM+SpringBoot+Vue.js3全栈开发从入门到实战微课视频版.北京清华大学出版社,
2022.
七、说明本课程的先修课程为《HTML+CSS+JavaScript^和《Java语言程序设计》，后续课程为《JavaEE框架全栈开发》
八、课程思政内容1培养学生的创新精神与创新意识党的二十大报告指出，“教育、科技、人才是全面建设社会主义现代化国家的基础性、战略性支撑必须坚持科技是第一生产力、人才是第一资源、创新是第一动力，深入实施科教兴国战略、人才强国战略、创新驱动发展战略，开辟发展新领域新赛道，不断塑造发展新动能新优势在当今激烈的竞争环境下，注重和加强学生创新精神和创新意识的培育是课程的极其重要内容2培养学生民族认同感，树立远大职业理想梳理国产操作系统的发展历史与现状，包括华为、中兴等国产企业在全球市场的崛起，在操作系统领域的新架构，向学生展示中国的信息技术领域成就，增强使命感与荣誉感；通过华为孟晚舟事件、美国的芯片垄断一引出民族认同感党的十八届五中全会通过的“十三五”规划《建议》，明确提出实施网络强国战略以及与之密切相关的“互联网+”行动计划国家正着力实现关键技术自主可控，为维护国家安全、网络安全提供技术保障中国信息化需求巨大，但在一些关键技术领域如操作系统、芯片技术、CPU技术等方面，还难以做到自主可控，对国家安全造成威胁引导学生明确建设网络强国，不仅仅是靠网络技术，还要有软件技术等其他各类技术的支撑引导学生作为软件技术专业的一员，应更加明晰专业人才的培养目标，更加明确专业领域内工作岗位和工作内容的社会价值，自觉树立远大职业理想，将职业生涯、职业发展脉络与国家发展的历史进程融合起来3向学生介绍中国在人工智能领域的布局，重点分析当代人工智能下软件技术如何支撑中国制造的智能化发展；4通过专业知识的学习，引导学生深刻理解与认识所学软件开发知识对于国家信息产业发展、智慧城市建设、大数据智能信息处理等各方面的重要意义，使学生在学习过程中逐渐树立专业荣誉感；5培养学生精益求精、工匠精神告诉学生在学好软件技术之后，走上工作岗位会成为程序员、软件系统运维人员、软件测试员、售前售后服务人员等在这些职位岗位上，要发挥工匠精神，精益求精地将程序开发、系统运维、程序测试、需求分析及技术问题处理等工作内容完成好，保证软件系统运行时正确、稳定，保证客户的需求被精确采集和纳入软件开发计划，保证软件运行时遇到问题能被及时解决引导学生在学习时，将知识夯实、精技强能，方能在今后工作中本领过硬，不出批漏，工作成果令用户满意引导学生认识到，作为职业人，其专注、敬业、责任担当对完成好本职工作，进而促进软件行业整体的高水平、优质化发展具有重要意义6培养学生团结协作，合作共嬴的精神通过实践项目、竞赛等，告诉学生今天的社会无论什么行业想要做出一番成就，靠一个人打拼已经不现实了所谓人多力量大，三个臭皮匠顶个诸葛亮......强调团队成员之间的资源共享、协同合作精神，团队成员在一个项目中要各司其职，每个人发挥自己的特长完成分配的任务，最终才能高质量、有效率地完成项目，从而形成更强大而持久的生产力和创造力。
个人认证
优秀文档
获得点赞 0
