CN112802374A - 一种跟随编程系统及方法 - Google Patents

Abstract

本发明公开了一种跟随编程系统及方法，该系统包括：服务器、老师客户端和学生客户端；老师客户端同步监听编写区域的代码内容和运行区域的结果信息；将监听的代码内容和结果信息发送到服务器；根据指令将编写代码发送到服务器；服务器将代码内容和结果信息同步发送至学生客户端显示；学生客户端接收代码内容和结果信息，在第一显示区域进行显示；在第二显示区域提供编码区域；根据指令将编写的代码发送到服务器；服务器将接收到的编写代码进行编译和运行；并将相应运行结果分别返回对应的老师客户端和学生客户端。本发明使老师和学生在上编程课时不需要专门安装工具和配置环境，只需要进入跟随编程系统，就可以边看边学边练习，有惑实时解答。

Description

一种跟随编程系统及方法

技术领域

本发明属于在线编程教育领域，涉及一种高校编程教学系统，特别涉及一种跟随编程系统及方法。

背景技术

在数据科学和人工智能技术急速发展的今天，场景感知的学习体验尤为重要。尤其是近些年来，随着互联网的快速蓬勃发展，学习编程已经成为学生必不可少的一项技能。

在传统的学习中，一般是老师和学生在老师里听讲理论知识或学生自己在网上观看知识讲解视频，学会后再在自己的电脑上安装开发工具、配置开发环境，再进行代码实操练习，如果过程中有任何问题，需要再通过聊天工具或截图工具或在下节课上课时，才能向老师求解。学、练、解惑，三大阶段相互隔离，阻碍了学习效率和效果的提升。

目前作为编程教学场景，常见的解决方式是开启直播，然后老师在直播间进行授课PPT展示、共享屏幕进行编程演示。过程中如果有问题，学生可发起连麦，然后共享屏幕显示给老师，或者截图自己的代码片段通过QQ等其他工具软件发送给老师。

对于目前已经公开的直播编程系统，有着一些自己的缺点。老师和学生不仅免不了安装编程工具配置开发环境，还需要安装直播客户端。代码直播相对而言有自己的独特性，例如字体普遍偏小，市面上常见的直播工具共享屏幕所能达到的清晰度不足，如果要保证清晰度，则对网络宽带的要求会大大提高。通常而言，学校的网络环境相对会慢一些，无疑更是加大了代码直播教学的阻碍。除此之外，通过直播的方式仍然不能解决编程学习的及时练习需求和模板对照需求，学生仍然是在观看老师老师直播讲完之后，再去做练习。整体而言，用户流程繁琐、网络条件要求高、实操及时性差、直播成本大。

发明内容

鉴于高校编程教学系统使用中用户流程繁琐、网络条件要求高、实操及时性差、直播成本大等问题，本发明的主要目的在于提供一种至少部分解决上述技术问题的一种跟随编程系统及方法。

为实现上述目的，本发明采取的技术方案为：

本发明实施例提供一种跟随编程系统，包括：服务器、老师客户端和学生客户端；

所述老师客户端同步监听编写区域的代码内容和运行区域的结果信息；将监听的代码内容和结果信息发送到所述服务器；根据指令将所述编写区域的代码发送到所述服务器；

所述服务器将监听的代码内容和结果信息同步发送至所述学生客户端显示；

所述学生客户端接收所述监听的代码内容和结果信息，在第一显示区域进行显示；在第二显示区域提供编码区域；根据指令将编码区域编写的代码发送到所述服务器；

所述服务器将接收到的编写代码进行编译和运行；并将相应运行结果分别返回对应的所述老师客户端和所述学生客户端。

进一步地，所述服务器包括云编译服务器和通信服务器；

所述云编译服务器执行编程语言对应的编译、运行的命令对创建的文件进行编译、运行；并将运行结果返回给对应的老师客户端或学生客户端；

所述通信服务器将监听的代码内容和结果信息通过Websocket协议同步发送至所述学生客户端显示；并通过Websocket协议实现所述老师客户端和所述学生客户端的实时互动。

进一步地，所述老师客户端，包括：

选择模块：用于选择课程编程语言；

显示功能模块：用于显示学生加入方式、发出开始上课指令、查看当前教室在线学习人数和发出结束课程指令；

监听模块：用于监听和保存所述老师客户端编写区域的代码内容以及运行区域的结果信息；并通过所述通信服务器发送到所述学生客户端；

编写模块：用于导入不同编程语言的的预装模板代码、编写代码、导出代码、清空代码；

运行模块：根据编译、运行指令将代码提交到所述云编译服务器编译、运行，并接收运行结果。

进一步地，所述老师客户端，还包括：

问卷模块：用于填写问题和内容，通过所述通信服务器向所述学生客户端发布问卷；查看所述学生客户端对问卷回答结果的统计、历史问卷；

答疑模块：用于根据所述学生客户端提交的问题代码选择查看并回答；

登录注册模块：用于注册并登录所述老师客户端。

进一步地，所述学生客户端，包括：

显示模块：用于实时显示所述老师客户端发送的代码内容和结果信息；

编写模块：用于提供与所述老师客户端相同编程环境、导入不同编程语言的预装模板代码、编写代码、导出代码、清空代码；

运行模块：根据编译、运行指令将代码提交到所述云编译服务器编译、运行，并接收运行结果。

进一步地，所述学生客户端，还包括：

回答问卷模块：根据所述老师客户端发布的问卷作答；

提问模块：用于通过所述通信服务器向所述老师客户端发送问题代码；

登录模块：根据所述老师客户端提供的加入方式登录所述学生客户端。

进一步地，所述老师客户端和/或学生客户端，包括：

导出模块：用于导出当前编辑器区域内的代码。

本发明实施例提供一种跟随编程方法，所述方法使用上述的跟随编程系统，实现跟随编程教学。

与现有技术相比，本发明具有如下有益效果：

本发明提供一种跟随编程系统，使老师和学生编程时无需安装工具并配置环境，只需进入跟随编程系统，即可轻松开启编程教学，边看边学边练习，有惑实时解答。

同时解决了编程教学目前存在的理论与实践异步、编程实践缺失、编程能力难以评价、编程疑惑解答不及时不便捷等问题，帮助培养学生的编程思维、提高高校计算机编程教学的能力，对于推动高校计算机教学模式创新有着重要的促进作用。

本发明的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本发明而了解。本发明的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。

下面通过附图和实施例，对本发明的技术方案做进一步的详细描述。

附图说明

图1为本发明实施例提供的跟随编程系统结构图；

图2为本发明实施例提供的跟随编程系统老师客户端模块框图；

图3为本发明实施例提供的跟随编程系统学生客户端模块框图；

图4为本发明实施例提供的跟随编程系统及方法学生提问解答流程图；

图5为本发明实施例提供的跟随编程系统及方法老师客户端编译运行过程流程图。

具体实施方式

为使本发明实现的技术手段、创作特征、达成目的与功效易于明白了解，下面结合具体实施方式，进一步阐述本发明。

在本发明的描述中，需要说明的是，术语“左”、“右”指示的方位或位置关系为基于附图所示的方位或位置关系，仅是为了便于描述本发明和简化描述，而不是指示或暗示所指的系统页面必须具有特定的方位、以特定的方位构造和操作，因此不能理解为对本发明的限制。

本发明提供了一种跟随编程系统，如图1所示，包括：服务器、老师客户端和学生客户端；

其中，老师客户端实时同步监听编写区域的代码内容和运行区域的结果信息，将监听的代码内容和结果信息发送到服务器。同时，根据指令将编写区域的代码发送到服务器，服务器将监听的代码内容和结果信息同步发送至学生客户端显示。学生客户端将接收到的监听的代码内容和结果信息，显示在第一显示区域，并在第二显示区域提供编码区域，根据指令将编码区域编写的代码发送到服务器。服务器执行老师课前选择的编程语言，对应老师客户端或学生客户端发送的编译、运行的命令，将创建的文件进行编译、运行，并将运行结果返回给对应的老师客户端或学生客户端。

本发明实施例提供的上述系统，旨在打造一款集教、学、练于一体的实时编程教学产品，老师和学生无需安装工具并配置环境，只需打开浏览器页面进入跟随编程，即可轻松开启编程教学，边看边学边练习，有惑实时解答。

该系统解决了编程教学目前存在的理论与实践异步、编程实践缺失、编程能力难以评价、编程疑惑解答不及时不便捷等问题，帮助培养学生的编程思维、提高高校计算机编程教学的能力，对于推动高校计算机教学模式创新有着重要的促进作用。

本发明实施例中，老师和学生无需安装任何插件，无需要搭建编程环境，仅通过浏览器登录就可以进行学习。学生在观看老师代码编程演示的同时，可随老师节奏实时编译代码并校验运行。

下面对服务器、老师客户端和学生客户端，在实施例中进一步详述：

在一实施例中，服务器包括云编译服务器和通信服务器；

云编译服务器执行老师初始选择的编程语言，并对应编译、运行的命令对创建的文件进行编译、运行，将运行结果返回给对应的老师客户端或学生客户端。通信服务器将老师客户端发送的监听代码内容和结果信息通过Websocket协议同步发送至学生客户端显示，并通过Websocket协议实现老师客户端和学生客户端的实时互动。

在一个实施例中，老师客户端，如图2所示，包括：

选择模块：用于老师选择课程所需的编程语言；

显示功能模块：用于显示学生加入方式、发出开始上课指令、查看当前教室在线学习人数和发出结束课程指令；

监听模块：用于监听和保存老师客户端编写区域的代码内容和运行区域的结果信息；并通过通信服务器发送到学生客户端；

编写模块：用于导入不同编程语言的的预装模板代码、编写代码、导出代码、清空代码；

运行模块：根据编译、运行指令将代码提交到云编译服务器编译、运行，并接收运行结果。

问卷模块：用于填写问题和内容，通过通信服务器向学生客户端发布问卷；查看学生客户端对问卷回答结果的统计、历史问卷；

答疑模块：用于根据学生客户端提交的问题代码选择查看并回答；

登录注册模块：用于注册并登录老师客户端。

导出模块：用于导出当前编辑器区域内的代码。

上述学生客户端，如图3所示，包括：

显示模块：用于实时播放显示老师客户端发送的代码内容和结果信息；

编写模块：用于提供与老师客户端相同编程环境、导入不同编程语言的预装模板代码、编写代码、导出代码、清空代码；

运行模块：根据编译、运行指令将代码提交到云编译服务器编译、运行，并接收运行结果。

回答问卷模块：根据老师客户端发布的问卷作答；

提问模块：用于通过通信服务器向老师客户端发送问题代码；

登录模块：根据老师客户端提供的加入方式登录学生客户端。

导出模块：用于导出当前编辑器区域内的代码。

具体实施例中，比如学生界面可为左右分屏，进行跟随式编程教学；左边屏幕的编译区域同步老师现场的代码编写过程，右边屏幕的编译区域是学生跟随练习的区域，使高校编程教学课堂同时具备直播的即时性和编程练习的对照性。学生在实操中如果遇到问题，还可随时通过当前页向老师发起提问，老师可实时收到提问，查看学生有疑问的代码片段，并进行讲解。

具体地，比如老师在登录注册模块根据账号登录使用本发明时，首先在选择模块，选择要授课的编程语言，之后进入显示功能模块可以上课、备课；点击备课之后，可以准备上课要用的示例代码或随堂笔记。点击开始上课按钮之后，进入上课页面，显示功能模块上显示学生加入教室的两种方式，方式一：访问上课地址，教室ID；方式二：带有当前教室ID信息的链接，学生通过不同的方式进教室，开始进行实时编程教学。

老师开始上课之后，可以使用本发明提供的编写代码、编译代码、运行代码、查看当前教室在线学习人数、发布问卷、提问答疑、查看备课信息、导入不同编程语言的的预装模板代码、导出代码、清空代码等功能；系统会自动监听老师客户端编写区域的所有代码内容和运行区域的结果信息，这些记录实时保存到MySQL数据库里面，以保证解决老师网络异常和数据异常的丢失问题，并通过通信服务器Websocket协议将这些记录发送到学生客户端并在第一显示区域显示模块展示出来，其中，老师客户端将当前时间与这一时间的代码内容和运行结果信息存储为一条数据。学生客户端为学生在第二显示区域提供和老师客户端一样的编程环境，减少不同电脑、不同系统带来的额外问题，只需浏览器即可完成编程课程的实时教学，不需要安装搭建编程环境，简便快捷高效。

学生根据老师客户端给出的加入方式在登录模块登录学生客户端，上课之后，进入左右分屏的界面，左侧(即第一显示区域)为显示模块用于观看老师客户端发送的代码内容和运行结果。通过通信服务器Websocket协议接收老师客户端发送的数据同步展示，用来观看学习老师的代码。右侧(即第二显示区域)有编写模块用于同步练习区域，右侧编写模块练习区域，提供了和老师客户端同样的编程环境、编写代码、导入不同编程语言的的预装模板代码、清空代码等功能，运行代码模块，提供了根据编译、运行指令将代码提交到所述云编译服务器编译、运行，显示编译、运行结果，提问模块，方便学生同步实践提问。

老师在老师客户端问卷模块发布问卷时，老师填写问题和内容，并提交。通过通信服务器Websocket协议把问卷发送到每一个上课的学生客户端回答问卷模块，学生对问卷的内容作出自己的答案。老师客户端可以查看学生客户端对问卷回答结果的统计，来跟踪学生课堂学习的结果。问卷模块还提供了历史问卷。

如图4所示，学生在学生客户端提问模块发起提问通过通信服务器Websocket协议使老师客户端接收提问代码，老师可以看到一个提问列表，点击学生张三的名字，当前编辑区域会变成我的代码和张三的代码，老师可以查看张三同学编写的代码和运行结果，然后在老师客户端编写模块做出回答。

编译时，如图5所示，系统会把老师客户端(或学生客户端)编写模块当前的代码提交到云编译服务器。云编译服务器会根据老师客户端(或学生客户端)的代码内容，将代码写入到文件中，通过执行编程语言对应的编译、运行的Linux命令对创建的文件进行编译、运行。最后云编译服务器将运行结果返回给老师客户端(或学生客户端)，将结果呈现在右侧运行模块上的运行代码展示区。另外，老师客户端把运行结果通过通信服务器Websocket协议同步发送到学生客户端显示模块展示出来。

导出模块，老师客户端(或学生客户端)想要导出编写模块代码，用户点击导出代码，本发明会把用户当前编写模块编辑器区域的代码，下载到本地电脑上。老师客户端、学生客户端均提供本功能，老师客户端导出代码学生客户端不会自动导出代码，学生客户端反之亦然。

基于上述一种跟随编程系统，本发明还提供了一种跟随编程方法，该方法包括：

S1：老师登录系统老师客户端同步监听编写区域的代码内容和运行区域的结果信息，做课前准备。

S2：学生登录系统，老师在老师客户端发出开始上课指令，开始上课；将监听的代码内容和结果信息发送到通信服务器；根据指令将所述编写区域的代码发送到云编译服务器；

S3：通信服务器将监听的代码内容和结果信息同步发送至学生客户端显示；

S4：学生客户端接收监听的代码内容和结果信息，显示在第一显示区域；在第二显示区域提供编码区域，根据指令将编码区域的编写代码发送到云编译服务器；

S5：云编译服务器将接收到的编写代码进行编译和运行，并将相应运行结果分别返回对应的老师客户端和学生客户端；

S6：老师在老师客户端发出结束课程指令，课程结束。

在一实施例中，步骤S4还包括，学生客户端提问答疑方法，如图4。

S41：学生在学生客户端提问模块向老师客户端发送提问代码信息；

S42：通过通信服务器Websocket协议将提问代码信息发送到老师客户端；

S43：老师客户端接收提问代码信息后，老师可以在提问列表看到提问学生名字，点击学生的名字，当前编辑区域会变成我的代码和所点击学生的代码，老师可以查看当前同学编写的代码和运行结果；

S44：老师在课堂上做出答疑。

在一实施例中，步骤S5还包括，老师客户端(或学生客户端)编译方法，如图5。

S51：老师(或学生)点击运行代码，将老师客户端(或学生客户端)编写模块当前的代码发送到云编译服务器；

S52：云编译服务器会根据老师客户端(或学生客户端)的代码内容，将代码写入到文件中，通过执行编程语言对应的编译、运行的Linux命令对创建的文件进行编译、运行，最后云编译服务器将运行结果返回给老师客户端(或学生客户端)；

S53：老师客户端(或学生客户端)接收云编译服务器运行结果后将结果呈现在运行模块上的运行代码展示区。

另外，老师客户端将运行结果通过通信服务器Websocket协议发送到学生客户端左侧第一显示区域显示模块展示出来。

本发明提供使用便捷省心、能即学即练、能便捷提问答疑、成本更低廉的产品解决方案，师生只需打开浏览器进入跟随编程系统直播教室，即可在页面上完成即学即练、实时提问答疑，更加贴合代码教学场景。

在浏览器对用户的键盘操作行为进行监控，最终形成一种“类视频类直播”形式的编程教学过程。只需浏览器即可完成编程课程的实时教学，不需要安装搭建编程环境，简便快捷高效。为学生提供和老师一样的编程环境，减少不同电脑、不同系统带来的额外问题。通过服务器Websocket协议实现老师客户端和学生客户端的实时互动、学生客户端实时查看老师编写代码的编写过程及运行结果。

本发明实施例提供的一种跟随编程系统及方法，具有以下优点：

用户只需进入跟随编程系统，便能完成编程教学的即学即练、在线提问答疑，成本低，体验好。用户可以在线编译，省去了开发工具安装以及开发环境配置。老师可以在上课前提前进入跟随编程在线教室进行备课，可以讲备课内容记录直接引用至上课期间，以免上课时需要编写很多前置内容，可有效突出课堂重点、提高课堂效率。上课过程中，学生可实时查看老师代码编辑区的代码编写过程，学生可在学生客户端编辑区跟随老师的代码过程进行代码编写，可复制老师的代码、可直接引用常用代码片段，微调后直接点击运行按钮，系统会将编辑区域的代码进行编译运行。

显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。

Claims (8)

1.一种跟随编程系统，其特征在于：包括：服务器、老师客户端和学生客户端；

所述老师客户端同步监听编写区域的代码内容和运行区域的结果信息；将监听的代码内容和结果信息发送到所述服务器；根据指令将所述编写区域的代码发送到所述服务器；

所述服务器将监听的代码内容和结果信息同步发送至所述学生客户端显示；

所述学生客户端接收所述监听的代码内容和结果信息，在第一显示区域进行显示；在第二显示区域提供编码区域；根据指令将编码区域编写的代码发送到所述服务器；

所述服务器将接收到的编写代码进行编译和运行；并将相应运行结果分别返回对应的所述老师客户端和所述学生客户端。

2.根据权利要求1所述的一种跟随编程系统，其特征在于：

所述服务器包括云编译服务器和通信服务器；

所述云编译服务器执行编程语言对应的编译、运行的命令对创建的文件进行编译、运行；并将运行结果返回给对应的老师客户端或学生客户端；

所述通信服务器将监听的代码内容和结果信息通过Websocket协议同步发送至所述学生客户端显示；并通过Websocket协议实现所述老师客户端和所述学生客户端的实时互动。

3.根据权利要求2所述的一种跟随编程系统，其特征在于：所述老师客户端，包括：

选择模块：用于选择课程编程语言；

显示功能模块：用于显示学生加入方式、发出开始上课指令、查看当前教室在线学习人数和发出结束课程指令；

监听模块：用于监听和保存所述老师客户端编写区域的代码内容以及运行区域的结果信息；并通过所述通信服务器发送到所述学生客户端；

编写模块：用于导入不同编程语言的的预装模板代码、编写代码、导出代码、清空代码；

运行模块：根据编译、运行指令将代码提交到所述云编译服务器编译、运行，并接收运行结果。

4.根据权利要求3所述的一种跟随编程系统，其特征在于：所述老师客户端，还包括：

问卷模块：用于填写问题和内容，通过所述通信服务器向所述学生客户端发布问卷；查看所述学生客户端对问卷回答结果的统计、历史问卷；

答疑模块：用于根据所述学生客户端提交的问题代码选择查看并回答；

登录注册模块：用于注册并登录所述老师客户端。

5.根据权利要求4所述的一种跟随编程系统，其特征在于：所述学生客户端，包括：

显示模块：用于实时显示所述老师客户端发送的代码内容和结果信息；

编写模块：用于提供与所述老师客户端相同编程环境、导入不同编程语言的预装模板代码、编写代码、导出代码、清空代码；

运行模块：根据编译、运行指令将代码提交到所述云编译服务器编译、运行，并接收运行结果。

6.根据权利要求5所述的一种跟随编程系统，其特征在于：所述学生客户端，还包括：

回答问卷模块：根据所述老师客户端发布的问卷作答；

提问模块：用于通过所述通信服务器向所述老师客户端发送问题代码；

登录模块：根据所述老师客户端提供的加入方式登录所述学生客户端。

7.根据权利要求6所述的一种跟随编程系统，其特征在于：所述老师客户端和/或学生客户端，包括：

导出模块：用于导出当前编辑器区域内的代码。

8.一种跟随编程方法，其特征在于：所述方法使用如权利要求1-7任一项所述的跟随编程系统，实现跟随编程教学。

Images