我们的“酷班级”班级管理应用主要采用了微信小程序开发技术、小程序云开发技术以及数据库技术，整体依托微信小程序的形式建立B/S架构，从而实现该班级管理平台的相关功能。
在用户前台界面展示上，我们考虑到微信小程序有很强的社交属性，可借助微信自带的流量，便于转发和分享，互动性强，通过社交机制能获得高转化裂变式的爆发。更吸引用户的是，小程序不用下载，即用即走，无需经过注册或验证等繁琐过程，过程方便且不占内存。小程序还具有安全稳定、功能丰富、有较好的产品延伸能力的特点，便于开发者后续迭代完善。因此，我们希望通过小程序这种载体实现目标功能。
在后台框架实现上，我们选择了小程序云开发，相较于传统的单独架设服务器的开发模式，云开发具有稳定性更高、维护成本低，开发速度快等优势。 云开发为开发者提供了完整的原生云端支持和微信服务支持，弱化后端和运维概念，无需搭建服务器，使用平台提供的 API 进行核心业务开发，即可实现快速上线和迭代，同时这一能力，同开发者已经使用的云服务相互兼容，并不互斥。所有后台功能皆由采用JavaScript编写运行在云端Node.js平台上的云函数（在云端运行的代码，微信私有协议天然鉴权，开发者只需编写自身业务逻辑代码）实现，
在数据库选择上，我们使用的小程序云开发提供的云数据库， 它是一个既可在小程序前端操作，也能在云函数中读写的 JSON 数据库。
在文件存储选择上，我们采用小程序云开发提供的云存储功能，无需自建存储和 CDN，可在小程序前端直接上传/下载云端文件，在云开发控制台可视化管理
在整体架构的开发实现上，我们选择采用B/S架构。对于开发者来说，B/S架构发简单，共享性强，成本低，数据可以持久存储在服务器端而不必担心数据的丢失。其次，它功能业务扩展比较灵活，增加服务器的功能，就能增加浏览器端的功能，因此维护起来简单方便，改变服务器端数据即可以实现所有用户同步更新。对于用户来说，随时随地都可以访问，只要用户安装了微信客户端就可享受该服务。
关键开发技术的说明如下：
（1）小程序开发框架
我们采用Taro框架进行开发，而非原生的小程序开发语言。Taro 是一套遵循 React 语法规范的 多端开发 解决方案。现如今市面上端的形态多种多样，Web、React-Native、微信小程序等各种端大行其道，当业务要求同时在不同的端都要求有所表现的时候，针对不同的端去编写多套代码的成本显然非常高，这时候只编写一套代码就能够适配到多端的能力就显得极为需要。
使用 Taro，我们可以只书写一套代码，再通过 Taro 的编译工具，将源代码分别编译出可以在不同端（微信 / 京东 / 百度 / 支付宝 / 字节跳动 小程序、快应用、H5、React-Native
等）运行的代码。所以我们选择了Taro，这样我们也可以将本应用同时部署到其他平台。
微信小程序的框架包含两部分View视图层、App Service逻辑层，两者分离，通过数据驱动，事件交互。视图层负责渲染页面结构，逻辑层负责逻辑处理、数据请求、接口调用等，两者在两个线程里运行，通过数据和事件进行通信，逻辑层提供数据给视图层，视图层通过绑定/捕获事件发起交互让逻辑层处理。
图3-1微信小程序开发框架图
视图层使用WebView渲染，逻辑层使用JSCore运行，视图层和逻辑层通过系统层的JSBridage进行通信，逻辑层把数据变化通知到视图层，触发视图层页面更新，视图层把触发的事件通知到逻辑层进行业务处理。
图3-2小程序运行逻辑结构图
在实际运行中，小程序和后台交互是通过运行时调用微信 API，发出API请求给微信，微信再通过网络请求发送到用户自己的服务器上，用户在自己的服务上拿到这个请求后进行数据的处理，然后再来响应到前端。
（1）系统划分
在系统分析阶段，本组采用U/C矩阵来表达过程与数据两者之间的关系，并通过完备性、一致性、无冗余性检验来验证U/C矩阵的正确性，在分析阶段以业务模块的横向拆分方法将系统划分成班级管理系统、用户个人信息管理系统、定位签到系统、请假管理系统、通知，作业管理系统、文件管理系统、系统管理子系统。系统划分原则如下：
①子系统具有相对独立性。
②高内聚。即模块内各个元素彼此间的联系程度紧密。尽量实现功能内聚，即每个模块中的所有处理元素都完成且仅完成一个功能。
③低耦合。即不同模块之间的互连程度低。尽量实现数据耦合，即模块之间只通过数据进行交换。
根据以上原则对系统的划分进行了优化，将系统分为：
① 班级管理系统：实现班级信息的增加、删除、查询、修改等。
② 用户个人信息管理系统：实现用户个人信息修改、用户其他信息维护等。
③ 定位签到系统：实现基于GPS定位的签到功能等。
④ 请假管理系统：实现请假、请假批复功能等。
⑤ 通知，作业管理系统：实现班级通知、班级作业的发布、查询、修改等。
⑥ 文件管理系统：实现班级文件的增加、删除、查询等。
⑦系统管理子系统。
1. 数据库
1）概念设计
用户：（创建时间，更新时间，用户班级，用户详细信息，用户微信信息，用户上次登录班级）
班级：（班级管理员，班级信息，班级秘钥，班级学生，创建时间）
作业：（作业内容，作业文件ID,作业图片ID，作业分类，作业标题，创建者）
班级通知：（通知内容，通知文件ID,通知分类1，通知分类2，通知标题，创建者）
请假：（请假人姓名，手机号，请假原因，假条状态，请假时间，请假人ID，请假人班级秘钥，提交时间）
签到：（签到地址，签到地名称，签到班级秘钥，签到开始时间，签到结束时间，签到点经度，签到点维度，签到名称，签到状态，签到学生信息）
2）逻辑设计
说明：本项目数据库使用的是云开发JSON数据库，因此会与一般数据库有所区别，如每条记录都会有”_id”、”_openid”字段，这是云开始自动生成的，分别代表记录ID，创建者OPID。
表1 用户信息表
表2 班级信息表
表3 班级作业表
表4 班级通知表
表5 班级请假表
表6 班级签到表
（1）微信小程序提供的API接口
Ⅰ. 开放接口
1）登录wx.login(Object object)
调用接口获取登录凭证（code）。通过凭证进而换取用户登录态信息，包括用户的唯一标识（openid）及本次登录的会话密钥（session_key）等。具体过程如下图所示：
图 3-14登录接口数据交换原理
2）用户信息wx.getUserInfo(Object object)
获取用户信息。res返回用户信息对象userInfo，包含微信用户的昵称nickName、头像图片链接avatarUrl、性别gender、省份province、城市city、国家country。
Ⅱ. 网络接口
1）发起请求 wx.request(Object object)
发起 HTTPS 网络请求。
要求传入——请求服务器接口地址url、参数data、请求的header、请求方法method。
res返回——云开发后台功能函数中返回的response。
2）上传文件 wx.uploadFile(Object object)
客户端发起一个 HTTPS POST 请求，将本地资源上传到服务器。
要求传入——下载资源的url、要上传文件资源的路径filePath、请求的header、文件对应的 key、请求方法method。
res返回——云开发后台功能函数中返回的response。
3）上传文件 wx.uploadFile(Object object)
客户端发起一个 HTTPS POST 请求，将本地资源上传到服务器。
要求传入——开发者服务器地址url、指定文件下载后的存储路径filePath、请求的header、请求方法method。
res返回——云开发后台功能函数中返回的response。
Ⅲ. 数据缓存
1）wx.setStorageSync(string key, any
data)
wx.setStorage的同步版本，要求传入缓存中指定的key、需要存储的内容data。小程序开发中存用户Cookie时用到。
2）wx.getStorageSync(string key)
wx.getStorage的同步版本。小程序开发中取用户Cookie时用到。
要求传入——缓存中指定的key。
res返回——key对应的内容。
Ⅳ. 其它
1）wx.createMap(string mapId)
创建地图对象。小程序开发中签到功能中定位功能需要。
要求传入——要获取上下文的
Map组件mapid 属性。
res返回——Map对象。
2）定时器
setInterval(function callback, number delay)。设定一个定时器。按照指定的周期（以毫秒计）来执行注册的回调函数。小程序开发中使用该接口每隔十五分钟执行检查并发送提醒邮件功能。
setTimeout(function callback, number delay)。设定一个定时器。在定时到期以后执行注册的回调函数，程序开发中使用该接口设定一定时间后刷新页面。
3）路由
wx.switchTab(Object object) 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。
wx.navigateTo(Object object) 保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。
“酷班级”小程序主要选择了扁平化界面设计，去除了冗余、厚重和繁杂的装饰效果，更少的按钮和选项，使得界面干净整齐，使用起来格外简洁，从而给用户更加良好的操作体验。除了界面美观之外，扁平化的界面设计还能达到降低功耗、延长待机时间和提高运算速度的效果，是程序运行更加流畅。
图 3-15主页面视图
（1）班级
下图展示了“酷班级”小程序的班级模块的详细页面。在班级模块中，用户可以查看班级通知、班级作业以及班级文件，也可以根据分类进行筛选查看。
图 3-16“班级”功能页
（2）工具
下图展示了“酷班级”小程序的工具模块，该模块包含发布通知、发布作业、上传文件、定位签到以及便捷请假功能。
图 3-17发布通知功能页面
图 3-18发布作业功能页面
图 3-19上传文件功能页面
图 3-20定位签到功能页面
其中，在我的签到中点击某项签到，页面将跳转至该次签到的签到界面以及签到情况界面。
图 3-21签到详情功能页面
（3）我的
下图展示了“酷班级”小程序中的我的模块，主要是用户个人账户信息管理以及班级管理等功能界面。
图 3-22 成员管理功能页面 图 3-23 个人信息功能页面
图 3-24 加入班级功能页面 图 3-25 创建班级功能页面
图 3-26 管理班级功能页面 图 3-27 我要反馈功能页面
图 3-23小程序页面结构图
（1）普通用户
用户可用微信扫描小程序二维码进入小程序。
（2）以开发者模式打开工程文件并调试
1）安装微信开发者工具并导入项目
前往 开发者工具下载页面 ，根据自己的操作系统下载对应的安装包进行安装，有关开发者工具更详细的介绍可以查看 《开发者工具介绍》 。
安装完成后，用微信扫码登录开发者工具。
点击添加按钮，选择导入项目，目录选择我们程序包中的“cool_class”文件夹，因为本项目使用了小程序云开发，所以需要申请APPID
（ https://mp.weixin.qq.com/wxopen/waregister?action=step1&token=&lang=zh_CN）。点击右下角“导入”按钮完成项目导入。
微信小程序项目导入界面
2）启用云开发
进入微信开发者工具后在左上角开启小程序云开发功能
云开发功能
3）启动Taro项目
① 若用户还未安装Node.js环境需要先下载Node.js安装包（>=8.0.0）。
Node.js 下载地址：https://nodejs.org/zh-cn/download/
若用户还未安装Django需要先下载Django安装包。
Django 下载地址：https://www.djangoproject.com/download/
建议使用WebStorm打开Taro项目。
WebStorm下载地址：https://www.jetbrains.com/webstorm/download/
②
对于已安装了Python和Django的用户：
Step1：需配置Taro开发环境
需要使用 npm 或者 yarn 全局安装@tarojs/cli，或者直接使用npx:
# 使用 npm 安装 CLI$npminstall-g @tarojs/cli
# OR 使用 yarn 安装 CLI$yarnglobaladd@tarojs/cli
# OR 安装了 cnpm，使用 cnpm 安装 CLI$ cnpminstall-g @tarojs/cli
注意事项
如果安装过程出现sass相关的安装错误，请在安装mirror-config-china后重试。
$ npm install -g
mirror-config-china
Step2：使用Webstorm打开“cool_class”文件夹，命令行进入 client目录下，执行“npm install”指令，执行完成后打开client目录下package.json文件，
选择运行命令：” build:weapp”,执行成功即完成项目热编译，修改源代码，在微信开发者工具中即可看见对应结果。
Taro 项目运行方法
4）调试小程序
使用微信开发者工具打开在第一步中导入的“酷班级”项目，编译模式选择“普通编译”，为获得最好的调试视觉体验，建议将模拟手机型号调整为Iphone6。
至此，用户便可在微信开发者工具中模拟手机调试小程序的功能了。
通过前期调研以及自身经历，本组发现现代大学生普遍存在班级管理困难的问题。大学班级的同学许多时候都不上同一节课，宿舍住宿区域也不集中，也会经常有同学加入、退出班级……这些问题都极大的影响了班级正常活动的开展，比如班委无法高效快速的向同学传递信息、考勤困难等问题。为解决这些难题，本组萌生了制作“酷班级”小程序的这一想法，“酷班级”能够使用户便捷地进行班级管理，考勤签到、发布通知在小程序中都变得简单且快速。另外，“酷班级”以微信小程序的形式发布，无需下载安装软件，减少了资源占用。
在开发实现这一功能构想的过程中，我们通过微信开发者平台、小程序云开发平台以及数据库之间的互联，整体依托微信小程序的形式建立B/S架构，实现了集消息推送、文件上传、定位考勤等功能于一体的班级管理平台。
但我们的作品只是初步完成了部分功能设想，在整体实现上还存在很大的可提升空间，具体的可改进方向包括以下几方面：
（1）文件上传模块的优化改进。在上传内存较大的文件时，现阶段版本需要花费较长的时间；另外，对于文件类型也有一定限制，现阶段仅支持部分格式的文件进行上传，有待进一步扩充。因此，我们的作品可进一步优化算法，降低时间复杂度和空间复杂度，增强代码的健壮性和正确性，提高程序运行效率。
（2）查找功能的完善。对于小程序中已发布的通知、作业及文件，我们目前仅支持分类筛选，还未实现搜索查找功能，当已发布的内容比较多时，需要耗费大量时间去查找某个文件或通知。因此，我们的作品中可增加模糊查询算法，实现对已发布内容的搜索查找，使用户使用体验更佳。
（3）增加社交板块。在实际生活中，我们在学习一门课程时经常会遇到大大小小的问题，因此，一个可以自由讨论的交流论坛对于我们的学习是非常有帮助的。希望之后能够在我们的作品中加入社交板块，为用户提供一个可以自由交流，进行学术探讨的平台，方便学生之间的沟通交流，同时也加强他们自身对知识的自我探索能力。