应用Vue的百倍课堂Web端系统设计与实现

Design and Implementation of A web-based System for Vue Classroom

目前的实际教学缺少有效的教学工具来帮助教师们更好地进行课堂管理以及增强学生们的学习兴趣。随着现代网络科技的日新月异,如何使课堂有效地通过不同的终端连接成一个整体,帮助广大教师提高授课效率和学生在课上的学习积极性和参与度,使学生更好地融入课堂,活跃课堂气氛,提高课上学习效率成为线下教学的迫切需求。本文基于Vue+Element UI+Axios+Vuex+Vue Router等技术设计在线课堂辅助工具百倍课堂,设计并实现了前后端分离的百倍课堂Web端的整体开发。通过组件化开发以及封装Axios请求与后台基于JSON格式来进行交互数据,最后部署通过搭载JENKINS和WEBPACK来完成项目的自动化打包部署,使用NGINX来运行整个前端项目。

In today's practical teaching,there is a lack of effective teaching tools to help teachers to better manage the classroom and enhance students'interest in learning.With the rapid changes of modern network technology in the mobile Internet era,how to make the classroom effectively connected by different terminals into a whole,help the majority of students and teachers to improve the efficiency of teaching and students'learning enthusiasm and participation in class,so that students can better integrate into the classroom,active classroom atmosphere,improve the efficiency of learning in class has become an urgent need for offline teaching.In this paper,we design the online classroom support tool"Hundredfold Classroom"based on Vue+Element UI+Axios+Vuex+Vue Router,and design and implement the overall development of the Web side of Hundredfold Classroom with the separation of front and back ends.And through component development and encapsulation of Axios requests and the backend based on JSON format to interact with data,the final deployment by carrying JENKINS and WEBPACK to complete the project automation packaging deployment,through NGINX to run the entire front-end project.