开发资源不足,如何15分钟快速上线自有品牌互动课堂?

良许Linux 2021-04-09 07:33



以下为CSDN记者用灵动课堂搭建在线课堂后的体验文:

据艾瑞咨询统计,2020 年中国在线教育行业市场规模 2573 亿元,过去 4 年的复合增长率达 34.5%。如今在线教育行业如火如荼,亟待一款好的在线教育平台。

 

此时,不少开发者和教育机构遇到新的难题:如果使用标准化 SaaS 平台,上手简单,但不能满足企业的个性化需求,产品单一,且关键信息和数据保存在第三方库里,可能有数据安全隐患。假如采用 PaaS 平台研发的话,虽然能很好地解决上述问题,但开发门槛较高。

 

如何兼顾开发成本、降低门槛,又能满足个性化定制需求呢?

 

拥有 7 年实时音视频云服务行业经验的声网 Agora,近日发布低代码 aPaaS 产品 “灵动课堂”,可帮助开发者最快 15 分钟上线自有品牌、全功能的在线互动教室。

 

真的假的?

 

虽然笔者没有音视频的开发经历,不过还真较真了,真的 15 分钟就能开发了吗?要不咱们动手试一试?

 

一、安装 Node.Js

先按照官网下载和安装好Node.Js:https://www.runoob.com/nodejs/nodejs-install-setup.html

 

二、新建 test.html,编写 demo 代码

 

将以下代码复制粘贴到 test.html:

<!DOCTYPE html><html lang="en"> <head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width, initial-scale=1">  <title>AgoraFlexibleClassroomDemo</title>  <script src="https://webdemo.agora.io/classroom-sdk-1.1.0-beta/edu_sdk.bundle.js"></script></head> <body>  <style>    #root1 {      width: 100%;      height: 100%;    }</style>  <div id="root1"></div>  <script type="text/javascript">    AgoraEduSDK.config({      // 你的声网 APP ID      appId: '<your appId>',    })    AgoraEduSDK.launch(
translateLanguage:"auto", document.querySelector("#root1"), { // 你的声网 token,生成token的uid需要和userUuid一致 rtmToken: "<your rtm token>", // 你的用户全局唯一标识 userUuid: "teacher1", // 用户名称 userName: "teac", // 你的房间全局唯一标识,互通需要双方进入同一个房间 roomUuid: "demo123" + new Date().getTime(), // 课堂的开始时间,课堂会在指定时间自动开始 startTime: new Date().getTime(), // 课堂的持续时间,课堂会在指定时间自动结束 duration: 1500, // 加入课堂的角色,1 - 老师,2 - 学生,3 - 助教 roleType: 1, // 课堂类型,0 - 1v1,4 - 小班课 roomType: 0, // UI语言 language: "zh", // 房间名 roomName: "demo-app", // 课件列表 courseWareList:[], // 是否打开设备预检 pretest: true, translateLanguage: "auto", listener: (evt) => { // 课堂事件监听 console.log("evt", evt) } } )</script></body> </html>

三、更换 appId、rtmToken:

需先准备好:

1、创建 Agora 项目并获取 App ID 和 App 证书,按照官方文档(https://docs.agora.io/cn/agora-class/agora_class_prep?platform=Web)做好灵动课堂后台配置的准备工作

 

2、生成 RTM Token

https://webdemo.agora.io/token-builder/

 

3、根据注释,修改代码中的 AppID、rtmToken。

 

四、运行程序

 

自由更换老师和学生角色,课堂形式:

 

根据注释内容,尝试修改roleType、roomType、roomName的值,然后把软件跑起来。执行命令行:

npm i -g live-server

live-server .

 

打开网页:http://localhost:8080/test.html

 

效果展示:

 

 

五、心得体会

 

我本人曾经也是一名开发者,有一定的开发经验,这个产品的设计对开发者体验是非常友好的,将底层音视频复杂逻辑进行模块化封装,上手快,非常易用。上述步骤很简单,一步步操作起来并不难。在这里提醒下大家,要想 15 分钟跑起来,需要提前安装好 node,申请好 appId、rtmToken,剩下的 5 分钟内就能跑起来一个在线课堂应用,没有音视频开发基础的小白均可上手!

 

据了解,灵动课堂自今年 1 月上线以来,不到 3 个月时间里,灵动课堂注册客户数超1000家,支持的课堂数量超过50万/月,全球覆盖学生数累计超过400万。据官网透露,这款软件平均可节省 90% 开发时间,提高开发效率,还兼顾个性化功能设计。上面笔者仅仅是尝试了简单的 demo 功能, 灵动课堂还支持修改 UI 布局、Logo等定制化需求。

 

实际应用方面,也有一些代表的案例。一家在区域内具备较强影响力的K12教培机构,受疫情对线下教育的冲击,加速OMO转型。但是由于在线化经验和研发资源不足,OMO推进频频受阻。通过声网灵动课堂,很好的解决了该机构上线难、上线慢的痛点,仅用1天时间就完成互动教室的搭建,将线下教学和线上辅导做到了有机的融合。

 

除了基于手机、PC的线上课堂场景,灵动课堂还能与智能硬件结合。武汉全品是定位于基础教育的内容供应商和服务者,他们希望打造一款物联护眼学习台灯。基于智能台灯开发实时互动课堂,对于全品来说,开发资源有限,自研难度较大,但他们希望功能尽快上线,适应智能台灯新产品发布节奏。通过灵动课堂,全品2小时开发了一个在线互动教室。

 

值得一提的是,嵌入在灵动课堂里的“白板”,看起来平平无奇,却大有乾坤。这是行业首个支持H5 课件的白板PaaS产品“互动白板”,可以快速实现多人实时互动白板协作,支持H5课件交互、动态PPT展示、轨迹实时同步、与音视频同步等多种功能。目前互动白板示例代码项目 Flat 已在开发者社区进行开源,大家可以下载试用:https://github.com/netless-io/flat