基于WEB的实验室展示系统设计.doc

  • 需要金币1000 个金币
  • 资料目录论文助手 > 高校设计 > 工业设计 >
  • 转换比率:金钱 X 10=金币数量, 例100元=1000金币
  • 论文格式:Word格式(*.doc)
  • 更新时间:2018-07-22
  • 论文字数:14761
  • 课题出处:(小山神)提供原创资料
  • 资料包括:完整论文

支付并下载

摘要:本设计主要在WEB上实现管理实验室和展示实验室的功能。系统主体分为三个部分:前台展示、教师管理、超级用户管理。在本次设计中采用React.js作为基础框架,然后选取蚂蚁金服的企业级React组件ant design作为界面组件库。结合react-router框架的前端路由和Webpack的按需打包的特性,实现了高性能、小体积的单页应用。

本系统编写主要采用了WebStorm编写代码。为了提高前端静态文件的转发性能,改用nginx作为静态资源服务器。在代码组织方面,将重复出现的代码提取为公共组件。一来减少打包文件的大小,二来也优化了软件的内存占用情况。

通过对js语言特性的合理运用,实现了体验接近原生应用的WEB App。

 

关键词:React.js ;单页应用;Webpack

 

目录

摘要

Abstract

1引言-1

1.1国内外发展现状-1

1.2系统开发目的-1

2.需求分析和系统架构-3

2.1需求分析-3

2.2 系统架构-3

3 系统概述-5

3.1 系统组成-5

3.2 设计流程-5

3.2.1前台展示模块-5

3.2.2教师后台管理模块-5

3.2.3超级用户管理模块-6

4模块设计-7

4.1 前台展示模块设计-7

4.1.1 实验室选择部分-7

4.1.2 实验室简介部分-8

4.1.3 实验室设备使用说明、实验室设备、实验室项目部分-10

4.1.4 登录、注册、更改密码部分-10

4.2教师后台管理模块设计-11

4.2.1 界面框架设计-11

4.2.2 添加实验室设备使用说明、设备、项目部分-12

4.2.3 编辑实验室设备使用说明、设备、项目部分-12

4.2.4 添加首页巨幕、上传实验室视频部分-13

4.3超级用户管理模块设计-14

4.3.1 用户注册、班级注册管理部分-14

4.3.2 添加实验室部分-15

5实现细节-17

5.1 前端路由的实现-17

5.2视频、图片等文件上传实现-18

5.3富文本编辑框实现-19

6打包发布-22

6.1 Webpack打包文件配置-22

6.2  按需加载-23

7 系统测试-24

7.1 性能测试-24

7.2 功能测试-25

结    论-26

参 考 文 献-27

附录A 程序源代码-28

致    谢-53


支付并下载

提示:本站支持手机(IOS,Android)下载论文,如果手机下载不知道存哪或打不开,可以用电脑下载,不会重复扣费