【010】基于Vue.js+springboot+Mysql的学生管理系统(含源码、数据库、实验报告、运行教程)

17 篇文章 0 订阅
4 篇文章 5 订阅

一.运行结果截图

(详细操作过程见文末,保姆级)

我的运行环境:Jdk1.8 +VSCODE+Mysql(版本建议5.2及以上)+IntelliJ IDEA专业版
前言:
基于Vue.js+springboot+Mysql的前后端分离的学生管理系统,项目功能很多,决对物超所值
这个相比于【003】进行了一定的简化和部分改善,而且附带实验报告
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

VScode运行前端代码截图:
在这里插入图片描述
IDEA运行后端代码截图:
在这里插入图片描述
MySQL后台数据库:
在这里插入图片描述

学生管理系统操作界面效果展示:

(1)管理系统登录界面(默认密码:a123456)
在这里插入图片描述
(2)管理员登录界面
在这里插入图片描述

(3)用户修改个人头像、邮箱、昵称等信息
在这里插入图片描述
(4)管理员对用户管理(拥有增、删、查、允许/禁止登录等权限,并且可以将数据导出为exel表格)。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

(5)管理员对学生管理(实现增、删、查、排序等功能)
在这里插入图片描述

(6)管理员对学院管理
在这里插入图片描述

(7)管理员对课程管理
在这里插入图片描述

在这里插入图片描述
(8)管理员查看数据字典
在这里插入图片描述

(9)管理员设置角色权限
在这里插入图片描述
在这里插入图片描述

(10)系统统计分析可视化图表生成及登录日志
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
(11)学生个人中心界面及选课
在这里插入图片描述
在这里插入图片描述

二.源码获取方式:

源码、数据库、实验报告获取:
1.淘宝搜店铺“七里空间”,找到“【010】Vue.js+springboot学生管理系统(含源码、数据库、实验报告”,拍下即可打包带走。
2.加qq:1004956190,备注来意,可远程部署。

三.保姆级操作教程:

一.vscode前端运行过程:
1.打开VSCODE,文件-打开文件夹
在这里插入图片描述
2.选择打开文件打开当前目录
在这里插入图片描述

3.新建终端:

4.安装 node-sass
在这里插入图片描述

npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
``

如果上一句失败则执行下面,将已下载东西 重新编译
```c
npm rebuild node-sass

5.安装其余的依赖

cnpm  install

在这里插入图片描述
启动项目

cnpm run dev

6.跳转即可打开
在这里插入图片描述
在这里插入图片描述

MYSQL数据库操作过程(保姆级)
登录数据库,打开sqlyog,建立好连接后,创建数据库在这里插入图片描述
数据库名称:boot_shiro_vue_stu,基字符集选择utf8(没有则数据库排序规则选择utf8_bin)
在这里插入图片描述
创建数据库后,点击数据库–导入–执行SQL脚本,
在这里插入图片描述
在这里插入图片描述
选择目录下sql文件,确认后导入成功。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
IDEA后端连接数据库 教程(保姆级):
(注意:建议使用jdk1.8)
在这里插入图片描述
选择对应目录
在这里插入图片描述
选择从外部模型导入maven项目
在这里插入图片描述

项目加载且右侧出现maven和databse
在这里插入图片描述
在右侧连接数据库
在这里插入图片描述
分别填入用户名、数据库密码、数据库名称
在这里插入图片描述
显示数据库连接成功
在这里插入图片描述
记得修改springboot-vue-student-master\springboot-vue-student-master\src\main\resources下application.yml配置文件的密码为自己数据库的密码。
在这里插入图片描述
更新maven文件
在这里插入图片描述
运行成功
在这里插入图片描述
以上操作配置完,便可以打开

http://localhost:8080/#/login

运行啦

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值