Web前端开发技术在在线学习平台中的研究与应用

2021-11-22

无线互联科技 2021年3期

（呼伦贝尔学院，内蒙古呼伦贝尔市 021008）

1 在线学习平台Web前端开发技术工程化现状

对在线学习平台Web前端开发技术工程化基本现状的梳理，有助于技术人员在思维层面形成正确的观念认知，准确把握技术弱项，明确Web前端开发技术应用要求，打造成熟完备的Web前端技术体系。

1.1 重视程度不高

在线学习平台在规划、设计过程中，为了确保教学资源的合理化使用，创设相应的学习场景，学校、教师以及研发人员应当重视在线学习平台的价值，转变构建、应用思路，积极做好在线学习平台的研发工作[1]。但是从实际情况来看，现阶段，在线学习平台的构建在很大程度上，忽视了对开发技术的选型与应用，导致在线学习平台的教育价值受到限制，这种情况的发生，无疑影响了在线学习平台构建成效，造成在线学习平台功能的单一化。

1.2 功能设置不完善

在线学习平台的核心功能在于教学资源的有效呈现，强化教学活动的互动性，为学生提供文本、视频、音频等各类教学资源，为学生自主学习活动的开展营造良好的氛围。例如目前较为成熟的网易公开课、Coursera等在线学习平台，形成了以视频课程为主、文本资源为辅的学习体系，在实践过程中取得了良好的效果，学生参与学习的积极性、主动性得到充分调动，课堂教学质量得到稳步提升。但是从实际情况来看，多数在线学习平台在功能设置过程中，没有能够根据学生的学习要求，进行教学资源的归集，进而造成教学资源的种类、数量无法满足实际的教育教学要求，无形之中，导致在线学习平台功能单一的情况发生[2]。例如部分在线学习平台缺乏在线考试、学生信息管理等模块，这种情况的出现，限制了在线学习平台的教学作用，对于相关教学活动的有序开展产生了限制。

1.3 技术体系不健全

在线学习平台构建过程中，为形成前端平台与终端平台的高效互动，往往需要研发人员对平台网页做出合理设计，以期在控制学习平台构建成本的基础上，稳步提升学习平台的环境适应能力。但是从实际情况来看，研发人员在进行学习平台构建的过程中，尽管使用了Web前端开发技术对在线学习平台进行针对性开发，但是在网页呈现方式过程中暴露出一系列问题。研发人员使用HTML+Flash的网页制作策略，对网页做出针对性的优化创新，但是也暴露出了相关技术问题[3]。例如Flash应用场景较为单一，大多数浏览器在没有安装加载控件的前体下，无法确保Flash的顺利加载，尤其是在APP等终端移动端口，在线平台的呈现效果不佳，教学资源难以得到科学化应用。这种不健全的技术体系，导致在线学习平台对于教学资源的调动能力受限，无法有效满足现阶段在线学习平台的运转要求。

2 在线学习平台Web前端开发功能需求

为增强Web前端开发技术的针对性，研发人员有必要着眼于在线学习平台的功能需求，以平台使用功能的打造为前提，依托现有的技术应用经验，积极促进Web前端开发技术的合理化应用，确保在线学习平台功能的全面发挥。

2.1 在线学习平台类型分析

在线学习平台Web前端开发技术的应用，其技术体系需求在于，对桌面端、移动端两种互动方式的合理进行。桌面端作为传统的在线学习途径，学生通过电脑访问在线学习平台，通过相关平台网站获取各类教学资源，强化教师与学生的互动能力，这种在线学习平台运转方式，可以降低学习成本，实现学习活动的碎片化，但是桌面式的学习方式，学生仍旧需要受制于空间的限制，自主性不高。随着WIFI等无线通信技术的成熟，在线学习平台在Web前端开发过程中，积极尝试做好移动端口的创建工作，通过APP等路径，操作各类移动终端，快速访问在线学习平台的相关模块，打破时间、空间等要素对于学习活动的限制，但是考虑到智能移动终端的体量，在进行功能设置、页面优化的过程中，需要依托相关技术手段，将在线学习平台以更加简洁的方式呈现出来，以确保在线学习平台中各类教学资源的高效呈现。

2.2 在线学习平台功能优化

研发人员在开展在线学习平台功能优化的过程中，需要充分利用Web前端开发技术，对网页端、APP端开展针对性的功能设置。具体来看，通过HTML5等Web前端开发技术，认真做好在线学习平台功能的全面优化。作为Web前端开发技术的重要手段，HTML5可以更好地优化桌面终端教学资源的呈现方式，在不需要加载的基础上，实现各类教学资源的完整呈现，对Flash技术完成了科学代替。在这种技术方式的支持下，可以增强学生的用户体验，丰富音频、视频等各类教学资源的播放格式。同时通过Web前端开发技术，研发人员可以在桌面网页的相关位置，构建起高效的索引模块，便于学生通过搜索关键词等方式，完成目标信息的获取。Web前端开发技术与在线学习平台的结合，实现了APP等移动终端平台的合理化构建，通过APP的科学规划与合理设置，在线学习实现了离线化、灵敏化以及存储化。具体来看，Web前端开发技术使得APP的模块规划更加符合学生的日常使用需求，将学习的内容快速加载到智能移动终端，即便APP处于离线状态，相关学习资源也可以存储到移动设备之中，便于学生开展各项学习活动。考虑到实际，Web前端开发技术在应用过程中，着眼于IOS系统、安卓系统的特点，增强整个在线学习平台APP的兼容性，丰富使用场景。从实际情况来看，在线学习平台APP的开发维护成本相对较高，Web前端开发技术在应用过程中，往往可以通过Hybrid等相关方式，完成APP的针对性设计，实现开发成本、平台兼容性、迭代更新的最优化，切实满足现阶段在线学习平台APP的使用要求，为学生的线上学习提供强大的技术支撑。

3 在线学习平台Web前端开发技术应用举措

3.1 打造前端应用网页

在线学习平台Web前端开发技术应用过程中，针对桌面终端、APP终端使用场景的不同，研发人员依托HTML5、Hybrid APP等开发手段，进行在线学习平台的响应设计，在保证学习资源呈现效果的前提下，增强各类终端平台的兼容性，以提升学生的使用体验。例如在前端应用网页的打造环节，研发人员基于HTML5技术，完成对前端应用网页的开发设计，通过这种网页设计方式，来加强学生与平台之间、学生与教师之间、学生与学习之间的互动性，将更多的网页要素、学习主题进行归集整合，为教学活动的进行营造出良好的外部环境。通过前端应用网页的构建，不仅可以更好地进行网页设计，确保教学资源的科学呈现，还可以为后端功能、离线功能的实现，提供必要的技术支撑。例如研发人员通过jQuery Mobile等Web前端开发技术手段，对在线学习平台的网页前端框架做出设置，使得在线学习平台前端网页之中的应用元素得到针对性、高效性的设置，同时也为后续网页应用元素的修改提供便利，稳步提升在线学习平台开发效率。

3.2 构建后端应用功能

在使用Web前端开发技术进行在线学习平台构建的过程中，除了做好前端应用网页的设置工作之外，还应当积极进行后端功能以及离线功能的高效设置。在实际操作过程中，研发人员应当做好相应的代码编写工作，通过代码的交互作用，将后台数据与前端网页更好地交互，实现后台与前端数据的动态更新，形成完整的缓存机制，以强化在线学习平台的离线功能，便于学生灵活开展各类在线学习活动。例如研发人员可以使用HTML缓存机制，将Web资源得以快速被本次应用程序调用，提升在线学习平台后端数据的获取、共享能力。除了做好缓存机制的构建之外，还需要通过Web Storage功能，对缓存数据做好保存。

3.3 丰富终端应用程序

在在线学习平台终端应用程序的设置环节，研发人员通过PhoneGap等技术手段，做好网站的封装操作，实现应用程序功能的丰富。以Android平台为例，在应用程序设置过程中，使用Eclipse建立一个文件夹，在文件夹下分别设立两个子文件夹，/libs以及/assets/www，同时通过PhoneGap将相关文件进行压缩，并存储到相关位置，同时启动java程序，做好文件夹的运行与修改，最终形成apk文件。