微信小程序实战课程开发与实施

赵剑冬，许智超

（广东技术师范大学计算机科学学院，广州510665）

0 引言

2017 年微信小程序诞生后，借助微信生态环境中迅速成为四种常见的移动应用开发模式之一[1]。微信小程序开发需要具备WXML 标签语言、WXSS 样式、JavaScript 脚本程序设计这三方面的基础知识[2]。实际上WXML、WXSS 与静态网页中涉及的HTML 和CSS很类似。面对具有静态网页开发基础的学习者，直接采用项目教学是可行的。

1 课程开发需求分析与讨论

计算机类课程及时融入新技术教学内容会受到学生的欢迎。新技术引入高校课堂的途径一般是首先考虑以在学校里面做讲座介绍新技术，然后开始尝试在相关课程中以章节形式介绍新技术，最后再考虑单独开设课程，教师开发教材或者讲义开始系统讲授新技术。

在课程开发前，通过梳理微信小程序开发涉及的知识点以及评估难易程度，初步考虑这门课程应该设置为32 个学时，也即每周2 课时，一个学期16 周的方式。另外32 课时对应4 个整天，也可以放在应用型大学某个学期末的两个实训周进行讲授。除此外，集中4天的课程教学还很适合在假期举办的面向职业教育师资的培训班中进行讲授。

传统程序设计类课程一般采用按知识点讲授的方法。但面对具有程序设计和静态网页设计基础的学习者，可以考虑该课程直接结合具体项目案例进行讲授。开展项目教学的关键是设计和开发一个具有实际应用背景，又容易理解的软件原型系统。当前微信小程序广泛应用于智慧校园、出行与交通、电商平台、商家自营、生活服务、餐饮、旅游、商业服务、体育等行业。考虑到电子商务是当前最热门的互联网应用领域之一，也是大学生最熟悉的移动应用方式，而且电子商务教师是职业教育信息技术类教师中一个比较大的群体，所以最终决定首先设计并开发一个基于微信小程序的电子商务原型系统。

2 课程设计与开发

2.1 原型系统的前端界面

整个移动电子商务原型系统包括前端部分和后台部分。前端部分主要提供交互界面给用户进行商品选购，以下列举几个常见的交互界面。如图1 所示，与常见的电商平台类似，系统首页展示商品分类导航，然后每个类别都列出一些推荐商品。图2 是商品分类页面，点击左侧每一类别，在右侧列出该类别下的全部商品。图3 是商品详情页，显示每个商品的照片、价格和详细商品图片文字介绍等。图4 是购物车页，显示当前打算购买的所有商品列表，可以继续添加商品或者删除购物车中的商品，然后去结算。

前端部分教学涉及的知识点主要包括小程序注册、开发工具、代码结构、JSON 配置文件、WXML 页面结构、WXSS 页面样式、JS 页面交互、JSON 数据交换格式、组件、微信小程序API、小程序调试和发布等。

2.2 原型系统的后台部分

整个移动电子商务原型系统的后台部分主要负责商品数据和用户数据管理。后台开发可以采用简单的云开发模式，也可以采用自主搭建Web 服务器数据接口的模式。其中第一种云开发模式无需搭建服务器，使用平台提供的API 就可以进行核心业务开发，可以实现快速上线和迭代的目标，而且与开发者已经使用的云服务相互兼容。云开发模式主要特点包括：①无需自建数据库，提供一个既可在小程序前端操作，也能在云函数中读写的JSON 数据库；②无需自建存储和CDN，在小程序前端直接上传/下载云端文件，在云开发控制台可视化管理；③支持云调用，基于云函数免鉴权提供开放接口的能力，使得小程序获得服务端调用、获取开放数据等能力；④支持云函数，也就是只需编写自身业务逻辑代码，这些代码在云端运行[3]。

第二种自主搭建Web 服务器模式可以采用结构化数据库，例如常见的Linux+Java+Oracle 或者Linux+PHP+MySQL 或者Windows+.NET+SQLServet 等开发工具套件，也可以考虑采用非结构化数据库，例如采用Linux/Windows+Python+MongoDB 的开发工具套件。自主搭建模式主要特点包括：①可以实现业务逻辑更加灵活的代码。例如小程序涉及计算量较大的任务时候，可以将计算由服务器端实施。②可以不受云开发基础资源配额的限制。例如云开发模式下对存储容量、云函数调用次数、单个云函数并发数、云函数数量等都有一定限制。③自主搭建Web 服务器的运行维护难度要高于云开发模式。考虑到学生前期已经学习过Java、.NET、Python 等开发语言以及Python 当前的热门程度，所以采用Python 进行自主搭建。

后台部分教学涉及知识点包括两部分，第一部分是云开发模式相关的，包括云开发模式介绍、云数据库、云函数、云存储等，第二部分是与自主搭建模式相关的，包括Python Web 开发环境、Flask 框架、MongoDB数据库等[4]。

图1 系统首页

图2 商品分类页

图3 商品详情页

图4 购物车页

2.3 教学进度设计

在课程开发过程中，严格遵循ADDIE 模式，并注重学习者计算思的培养[5-6]。通过对计算思维结构的深入研究，认为计算思维包括算法思维、评估、分解、抽象、概括五个方面要素[7]。计算思维在信息技术课程中表现为六组思维主题，即对象与管理、设计与制作、系统与工程、规则与安全、合作与协作、伦理与道德[8]。以计算思维结构为基础，以计算思维主题为主线，为整个课程开发作为理论指导的基础。在信息技术类专业中，核心素养主要关注学习者能否适应信息技术的飞速发展。整个教学过程采用基于面向核心素养的项目学习法，将整个项目细化为多个实训环节，从而有效激发学习者的学习动力。整个课程的教学进度设计如表1 所示。

2.4 课程资源开发

结合教学进度设计，研究团队开发了每一章节的课程资源。考虑到所在高校与超星平台进行合作，该平台允许编辑章节和支持发布各种格式教学资源，所以选择将课程资源发布在超星平台上，如图5 所示。课程资源主要包括教学讲义、思维导图、教学课件、教学微课、示例代码和课后复习提示等。课程资源开发的目标是希望达到任何一位主讲教师，依赖提供的课程资源，经过自学掌握后，借助平台提供的教学课件、教学微课就可以完成这门实战课程的讲授。编撰的教学讲义严格按照系统模块开发流程逐一介绍电商系统首页、商品分类页、商品详情页和后台开发的技术细节。思维导图主要让学习者可以抓住每个部分的关键知识点，如图6 所示。同时课程资源也给学习者提供了示例代码和课后复习的提示。

3 课程开发与评价难点

3.1 计算思维如何与课程融合

在课程设计中将计算思维主导引入课程开发，借鉴计算思维结构模型绘制微信小程序课程开发的计算思维三棱结构。在微信小程序课程的计算思维结构描述中，学习者基础层的内容为计算思维环境、微信小程序电商系统与架构、开发工具与配置、协作与交互；学习者专项能力层中包含微信小程序开发的前端设计与制作品质、数据库逻辑品质；在学习者的思维方法层中主要包括微信小程序开发的创新品质。一方面章节设置要包含以上各点，另外一方面，按照基础层、专项能力层和思维方法层给予学习者必要的启示。例如在期末课程作品选题环节，注意给学生点评全国高校微信小程序比赛选题，在课程资源开发环节也包括优秀作品选登。

图6 思维导图

3.2 如何进行教学实施

课程的实施可以考虑单独开设一门选修课，或者融合在相关课程中提及微信小程序开发模式。在应用型高校的计算机类专业人才培养计划中一般已经开设了《HTML 语言程序设计》、《Android 移动应用开发》或者《iOS 移动应用开发》、《Web 程序设计》、《Java 程序设计》等课程，而且由于人才培养计划总学时限制，所以本课程是选择与在计算机学院本科生三年级开设的电子商务课程融合在一起实施的。

相对于在经济管理学院侧重电商营销和物理管理，计算机学院开设的电子商务课程更侧重电子商务技术。该课程每周3 课时，其中2 课时进行理论讲授，1 课时实训内容讲授，主要将以上的微信小程序教学内容压缩为16 课时进行讲授。由于计算机学院大三的学生前期已经具备程序设计、HTML、数据库等知识基础，所以重点引导学生理解电商小程序系统的前端首页、商品分类页、商品详情页以及云开发模式后，学生便能通过课后自学迅速掌握微信小程序开发技术，期末能提交一个电商微信小程序原型系统作为课程考核作品。

3.3 如何进行教学评价

本研究运用课程评价理论[9]，根据信息技术专业实践课程的基本特征，进行理论推演，采用问卷调查的方法收集信息基点，构建了实战课程的评价指标体系包括课程标准、课程知识目标、课程技能目标、课程内容选取、实践内容组织与安排、课程内容呈现形式、教学设计、教学手段、教学资源、教师教学态度、学生学习态度、知识掌握、技能掌握等，如表2 所示。

表2 课程评价指标体系

整个评价过程采用了校内评价和社会评价相结合，校内评价包括学生评价和专家评价，学生评价采用调查问卷法，专家评价采用访谈法邀请三位从事软件开发技术、教育评价和教育技术的专家进行评价，而社会评价也是通过邀请三位企业工程师进行访谈。

4 教学实践历程

以广东技术师范大学为例，介绍微信小程序新技术引入大学课堂的历程。2017 年1 月小程序正式发布，广东技术师范大学计算机学院研究生团队根据导师指导开始进行技术跟踪研究。2017 年10 月，计算机学院派遣研究生到深圳某公司参加小程序开发实习，该公司由腾讯公司前员工团队创立。

2018 年6 月，在计算机学院大二、大三学生的期末17-18 周的项目实训周引入微信小程序开发实训。整个实训采用企业工程师主讲+校内教师随堂辅导的模式，邀请了腾讯前资深工程师、互联网企业唯品会资深工程师主讲。通过这种模式，一方面提高了学生动手能力，另一方面也使得校内教师及时掌握了企业流行的项目开发技术。

2018 年6 月，计算机学院组织团队申请教育部腾讯协同育人项目第一批项目，并于9 月立项获批经费资助，并派遣教师在广州岗顶参加腾讯公司组织的微信小程序高校教师培训班。2018 年12 月14 日，笔者在校本部208 讲学厅面向全校学生做周末讲座，讲座主题“微信小程序与创新创业”，受到学生的热烈欢迎。2018 年12 月，在北京参加“中国高校微信应用教育联盟”年会，广东技术师范大学计算机学院获颁发联盟成员证书。

经过前期的准备，2019 年全年逐步完善《微信小程序实战课程》并将课程资源发布在超星平台上。同时结合计算机学院大学三年级开设的《电子商务》课程，将微信小程序电商系统开发嵌入作为该课程的实训环节。

5 结语

大学计算机类专业本科生对市面出现的新技术非常感兴趣。大学教师在课程中及时融入新技术教学内容会受到学生的欢迎。本文介绍了广东技术师范大学作为广东省应用型大学转型试点高校，及时将微信小程序开发技术引入大学课堂的历程。通过积极参与教育部协同育人项目计划，与互联网企业紧密合作进行实战课程开发，能获得企业资金资助和技术培训支持。课程开发中，注重计算思维的培养，通过项目导向法进行课程的讲授，规避了传统按知识点讲授的缺点。最终通过课程评价验证了整个课程设计和开发模式确实达到预期目标，也顺利完成了整个教育部协同育人项目的结题工作。