专为新手入门准备的Vue+Spring Boot+Mysql的前后端开发项目

今天TJ君和大家分享一个适合新手入门学习Vue+Spring Boot+Mysql前后端分类开发模式的图书馆管理项目，白卷

首先，介绍之前要提醒大家的是，项目只要是为了让新手入门学习用的，所以考虑的更多的是浅显易懂，至于安全防护问题，并没有过多的设置，所以如果要用做生产二次加工的小伙伴，要自己注意安全防护哦~

白卷的应用架构和技术架构分别是这样的：

技术栈包含：

• 前端

• Vue.js
• ElementUI
• axios

• 后端

• Spring Boot
• Apache Shiro 3.Apache Log4j2 4.Spring Data JPA 5.Spring Data Redis

• 数据库

• MySQL
• Redis

所谓白卷的意思，并不是指看书如同白卷，而是指项目为了方便新人入手，从0开始，像一张白卷一样教会大家使用，项目的实际效果呢，也是不错滴：

项目安装部署方法：

• 1.clone 项目到本地

• 2.在 mysql 中创建数据库 wj，运行项目，将自动注入数据。如需关闭此功能，请将 application.properties 中的 spring.datasource.initialization-mode=always 代码删除。数据库完整脚本 wj.sql 放在后端项目的 src\main\resources 目录下，也可根据需要自行在 MySQL 中执行数据库脚本。运行项目前请启动 Redis 服务，端口为 6379（默认端口），密码为空。

• 3.数据库配置在后端项目的 src\main\resources 目录下的application.properties 文件中，mysql 版本为 8.0.15 。

• 4.在IntelliJ IDEA中运行后端项目，为了保证项目成功运行，可以右键点击 pom.xml 选择 maven -> reimport ，并重启项目

如果要运行前端项目，可以访问http://localhost:8080，系统默认账号是 admin，密码是 123。

二次开发

如果要做二次开发，进入前端项目根目录中，在命令行依次输入如下命令：

# 安装依赖
npm install

# 在 localhost:8080 启动项目
npm run dev

由于在 wj-vue 项目中已经配置了端口转发，将数据转发到SpringBoot上，因此项目启动之后，在浏览器中输入 http://localhost:8080 就可以访问我们的前端项目了，所有的请求通过端口转发将数据传到 SpringBoot 中（注意此时不要关闭 SpringBoot 项目）。

最后可以用 WebStorm 等工具打开 wj-vue项目，继续开发，开发完成后，当项目要上线时，依然进入到 wj-vue 目录，然后执行如下命令：

npm run build

该命令执行成功之后， wj-vue 目录下生成一个 dist 文件夹，可以将该文件夹中的两个文件 static 和 index.html 拷贝到 wj 项目中 resources/static/ 目录下，然后直接运行 wj 项目，访问 http://localhost:8443 ，实际上是把前端打包后作为静态文件。

喜欢的小伙伴，记得给TJ君点个赞哦！

点击下方卡片，关注公众号“TJ君”

回复“白卷2022”，获取仓库地址

关注我，每天了解一个牛x、好用、有趣的东东