rw战队|SpringBoot + Vue 开发的一款前后端分离实战项目！可视化拖拽设计

文章图片

文章图片

文章图片

文章图片

文章图片

文章图片

文章图片

文章图片

文章图片

介绍这个项目的名字叫做AJ-Report ，是 Gitee 上的一个 GVIP 项目。

这是一个开源免费的拖拽编辑的可视化设计工具，使用这个项目三步即可快速完成大屏开发。并且，这个项目支持多种数据源以及多种样式的图标拖拽式设计。

我们直接可视化拖拽编辑内置的组件来进行大屏设计，具体操作的效果过如下：

这个项目的技术栈是什么样的呢?

项目的后端基于 Spring Boot + MyBatis-plus（MyBatis 增强版）+Flyway[1
（数据库版本管理和迁移工具），都是业界目前比较主流的技术。
项目的前端基于 Vue 全家桶+Element（桌面组件库）+Avue（采用 Element 框架低代码前端框架，它使用 JSON 配置来生成页面，可以减少页面开发工作量，极大提升效率）。

都是比较主流的技术，比较适合拿来学习。

另外，你可以通过在电脑端在线体验这个过程，私信团长【源码】获取在线体验地址+体验账号。

当然了，如果你想本地搭建环境来学习或者体验这个项目的话，也是比较简单的。
项目环境搭建开始搭建环境之前，首先需要通过 Git 将项目克隆到本地。
? git clone https://gitee.com/anji-plus/report.git

项目结构概览使用ll 命令查看一下文件夹中有什么。
? lltotal 72-rw-r--r-- 1 guide staff 11K 8 12 15:22 LICENSE-rw-r--r-- 1 guide staff 1.9K 8 12 15:22 README.en.md-rw-r--r-- 1 guide staff 6.3K 8 12 15:22 README.md-rw-r--r-- 1 guide staff 996B 8 12 15:22 build.sh-rw-r--r-- 1 guide staff 732B 8 12 15:22 derby.logdrwxr-xr-x 6 guide staff 192B 8 12 15:22 doc-rw-r--r-- 1 guide staff 559B 8 12 15:22 pom.xmldrwxr-xr-x 6 guide staff 192B 8 12 15:22 report-coredrwxr-xr-x 15 guide staff 480B 8 12 15:22 report-ui

主要关注下面这四个文件夹即可：