Build Interactive Dashboards Fast with AJ-Report: A SpringBoot‑Vue Open‑Source Tool

Introduction

The project, named AJ-Report , is a free open‑source visual design tool hosted on Gitee. It enables rapid development of large‑screen dashboards through drag‑and‑drop components and supports various data sources and chart styles.

The tool is built on a mainstream tech stack, making it suitable for learning.

Technology Stack

The backend uses Spring Boot + MyBatis‑plus + Flyway for database version control.

The frontend is based on the Vue ecosystem, Element UI, and Avue, a low‑code framework that generates pages from JSON configuration.

Both sides employ widely adopted technologies.

Project Links

Repository: https://gitee.com/anji-plus/report

Online documentation: https://report.anji-plus.com/report-doc/

Online demo: https://report.anji-plus.com/index.html (account: guest, password: guest).

Project Environment Setup

Clone the Repository

git clone https://gitee.com/anji-plus/report.git

Backend Environment

Open the report-core module with an IDE (e.g., IDEA) and configure the database in bootstrap-dev.yml. Adjust MySQL connection details to match your environment.

If you need file‑upload functionality, also modify the two additional configuration sections shown below.

After updating the configurations, start the backend. The screenshot shows a successful local launch.

Frontend Environment

The frontend requires a Node.js development environment. Verify Node and npm versions:

node -v

npm -v

Install dependencies and start the project:

npm install

npm start

Refer to package.json for available scripts.

Usage Experience

1. Configure Data Sources – The tool supports MySQL, Elasticsearch SQL, Kudu Impala, and HTTP.

2. Write SQL for Datasets – After configuring a data source (e.g., MySQL), you can create datasets using SQL.

3. Drag‑and‑Drop to Build Dashboards

Creating a new screen opens the visual editor where components can be dragged onto the canvas.

Multiple screenshots illustrate the design process.

References

Flyway: https://flywaydb.org/

Microsoft Docs – Set up Node.js on Windows: https://docs.microsoft.com/zh-cn/windows/dev-environment/javascript/nodejs-on-windows