JAVA毕业设计096—基于Java+Springboot+Vue的在线教育系统(源码+数据库+18000字论文+开题)

140 篇文章 8 订阅

基于Java+Springboot+Vue的在线教育系统(源码+数据库+18000字论文+开题)096

一、系统介绍

本系统前后端分离

本系统分为管理员、用户两种角色(管理员角色权限可自行分配)

用户功能:

  • 注册、登录、课程预告、在线课程观看、学习资料下载、学习文章预览、个人信息管理、消息通知、签到、vip购买、密码修改

管理员功能:

  • 部门管理、角色管理、员工管理、用户管理、讲师管理、课程管理、资料管理、锦囊管理
  • 数据分析、公告管理、vip管理、轮播图管理、订单管理、课程审核、文章审核、资料审核、特训班审核、密码修改、个人信息管理

文档截图
在这里插入图片描述

管理后台功能结构
在这里插入图片描述

前台功能结构
在这里插入图片描述

二、所用技术

后端技术栈:

  • Springboot
  • SpringMvc
  • mybatis
  • mysql
  • Mail邮箱
  • SpringSecurity
  • 阿里云短信
  • redis
  • 支付宝沙箱

前端技术栈:

  • Vue
  • Vue-router
  • axios
  • element-ui
  • html
  • ajax
  • jquery

三、环境介绍

基础环境 :IDEA/eclipse, JDK 1.8, Mysql5.7及以上, Node.js(14.21), Maven3.6, Vscode, 支付宝沙箱账号, ngrok, redis

所有项目以及源代码本人均调试运行无问题 可支持远程调试运行

四、页面演示

1、前台页面

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2、管理员页面

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

五、浏览地址

  • 前台访问路径:http://localhost:8080
    931708230@qq.com/123456
  • 后台访问路径:http://localhost:9000
    admin/123456

六、安装教程

  1. 使用Navicat或者其它工具,在mysql中创建对应名称的数据库,并执行项目的sql

  2. 使用IDEA/Eclipse导入breadroll-admin项目,导入时,若为maven项目请选择maven; 等待依赖下载完成

  3. 修改application-jdbc.yml里面的数据库配置,application-mail.yml里面的邮箱配置,application-redis.yml里面的redis配置和PropertiesUtil里面的文件路径配置,
    src/main/java/top/qiudb/controller/util/UploadController.java里面的文件路径配置

  4. BreadrollAdminApplication启动项目

  5. 使用IDEA/Eclipse导入breadroll-education项目,导入时,若为maven项目请选择maven; 等待依赖下载完成

  6. 修改application-jdbc.yml里面的数据库配置,application-mail.yml里面的邮箱配置,application-redis.yml里面的redis配置和PropertiesUtil里面的文件路径配置
    config.properties里面的文件路径配置,AlipayConfig里面的支付宝沙箱配置,还要用ngrok先将内网穿透配置好

  7. BreadrollEducationApplication启动项目

  8. vscode或idea打开breadroll-web项目

  9. 在编译器中打开terminal,执行npm install 依赖下载完成后执行 npm run dev,执行成功后会显示前台访问地址

七、ngrok配置内网穿透

1、打开ngrok

2、执行 ngrok http http//ip:端口

3、将生成的地址替换代码中的回调地址和支付宝沙箱控制台里面的回调地址,如下图所示
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值