[開源]一款基于 Vue3 + Vite + Antdv + Spring Boot 實現(xiàn)的低代碼開發(fā)平臺(開源vue項目)
一飛開源,介紹創(chuàng)意、新奇、有趣、實用的免費開源應(yīng)用、系統(tǒng)、軟件、硬件及技術(shù),一個探索、發(fā)現(xiàn)、分享、使用與互動交流的開源技術(shù)社區(qū)平臺。致力于打造活力開源社區(qū),共建開源新生態(tài)!
一、開源項目簡介
Seezoon Stack 以快速開發(fā)為目的,在開發(fā)速度和代碼結(jié)構(gòu)上做出一定取舍,無論如何,你將看到非常地道的 Java 常用開發(fā)框架使用。該項目采用主流開發(fā)框架,無論打包、編譯、部署都按著大公司的標(biāo)準(zhǔn)完成并不斷逐步完善。
二、開源協(xié)議
使用MIT開源協(xié)議
三、界面展示
部分效果圖:
四、功能概述
特性
- JSR303 驗證、標(biāo)準(zhǔn)API模型,錯誤碼、異常處理封裝
- 請求埋點,返回頭添加X-Trace-Id,通過MDC在日志中埋入線程ID;
- Redis 封裝,序列化
- RestTemplate 線程池、證書請求及默認(rèn)屬性約定
- Spring Boot 異步線程配置
- 跨域支持
- 基于openAPI 3.0 規(guī)范的自動生成文檔
- 前后端一體化代碼生成
- 登錄及權(quán)限控制
- 文件處理,支持磁盤文件和阿里云OSS
- 國際化
- 通用數(shù)據(jù)權(quán)限
- 動態(tài)菜單&按鈕
優(yōu)先級較低的功能(TODO):
- 阿里云短信
- Excel 處理
- 微信公眾號、小程序相關(guān),登錄,支付等常用封裝
- 云原生部署及編排文檔
五、技術(shù)選型
Seezoon Stack 采用當(dāng)下最前沿前后端的技術(shù)棧完成。
后臺主要框架:
框架名稱 | 說明 |
Spring Boot | 自動裝配 |
Spring Session Data Redis | 登錄態(tài)管理 |
Spring Security | 登錄及權(quán)限控制 |
Mybatis | 持久層 |
Springfox | openAPI 3 文檔 |
前臺主要框架:
框架名稱 | 說明 |
Vue 3 | 雙向綁定 |
Vite | 構(gòu)建工具 |
Ant Design Vue 2 | 組件 |
TypeScript 4 | JavaScript 超集 |
Windi css | css 輔助類 |
Iconify | 圖標(biāo)庫 |
前端框架 fork Vue vben admin 2.0,定期會合并上游特性,具體組件請參考 Vben admin 文檔。在此也感謝Vben admin 對該項目提供的幫助。
前端主要采用Ant Design Vue 2 作為主要組件庫,降低學(xué)習(xí)成本,主體框架均為TypeScript,業(yè)務(wù)功能采用JavaScript編寫,針對快速開發(fā)JavaScript 代碼量較為簡潔,速度較快。
環(huán)境準(zhǔn)備
- JDK 1.8 (建議11)
- Maven 3
- Node 12
- yarn(安裝完node,可用npm install -g yarn)
- Redis
- Mysql 5.7 (建議8)
快速開始
代碼下載
可以通過 IDEA File->New->Project From Version Control 導(dǎo)入,也可以通過命令下載后導(dǎo)入。
建議fork 后到自己倉庫后再導(dǎo)入,方便后續(xù)同步更新。
工程結(jié)構(gòu)
```.└── seezoon-stack parent工程 ├── build 構(gòu)建所需文件 │ ├── assembly 生成產(chǎn)出物結(jié)構(gòu) │ │ ├── bin 項目腳本 │ │ ├── conf 配置目錄 │ │ ├── logs 日志目錄 │ │ └── assembly.xml maven assembly 打包插件描述文件(不打包到產(chǎn)出物) │ ├── build.sh 構(gòu)建腳本 │ ├── eclipse-codestyle.xml P3C代碼格式,可以自行更新 │ ├── maven-settings.xml maven的setting配置(可選) │ └── mybatis-generator-config.xml 原生mybatis-generator 描述文件(可選) ├── db DB腳本目錄 ├── doc 項目文檔及資料維護(hù)目錄 ├── seezoon-admin-server 管理端服務(wù) ├── seezoon-admin-web 后臺頁面目前fork上游,代碼庫單獨維護(hù)穩(wěn)定后合并 ├── seezoon-dao DAO層,方便管理端和C端引用 ├── seezoon-framework 管理端和C端通用框架層(基礎(chǔ)中間件,參數(shù)驗證,安全控制) ├── seezoon-generator 通用代碼生成器,可以單獨使用也可以供其他組件繼承使用 └── seezoon-user-server C端服務(wù)端TODO```
后臺
- 初始化DB腳本
- 腳本見db/seezoon-stack.sql
- 配置seezoon-admin-server
- 在如下配置文件配置DB和Redis賬號密碼
- seezoon-admin-server/src/main/resources/application-local.properties
- IDEA中啟動后臺
執(zhí)行如下類中Main方法(如果報依賴錯誤,可以執(zhí)行parent 工程mvn package)
seezoon-admin-server/src/main/java/com/seezoon/admin/AdminMain.java
前臺
- 安裝依賴并啟動
- cd seezoon-stack/seezoon-admin-web yarn install yarn serve # 訪問地址 http://localhost:3100/
- 本地測試文件服務(wù)器(可選)
- cd seezoon-admin-web/test/server/upload yarn install yarn start # 管理端上傳文件后,可以直接訪問地址static目錄靜態(tài)文件 http://localhost:3001/static/xxxx
生產(chǎn)環(huán)境部署
線上目錄結(jié)構(gòu),
/data/│── cert├── seezoon-admin-server # 后臺產(chǎn)出物│ ├── bin│ ├── conf│ ├── logs│ └── work├── seezoon-admin-web # 前端產(chǎn)出物│ ├── assets│ └── resource└── upload-server 文件上傳目錄,默認(rèn)使用磁盤文件,使用OSS則不需要.
手工部署-后臺
線上環(huán)境安裝Java 1.8 ,推薦11。
采用maven-assembly-plugin生成構(gòu)建物,可以直接生成生產(chǎn)部署的目錄結(jié)構(gòu),方便DevOps 集成.
cd seezoon-admin-servermvn clean package
產(chǎn)出物目錄
seezoon-admin-server/target/seezoon-admin-server
只需要維護(hù)產(chǎn)出物conf 目錄的application.properties 即可,然后就可以發(fā)布了。
配置文件與環(huán)境分離,maven-jar-plugin 打包產(chǎn)出物jar會排出resources目錄如下文件:
application-local.propertieslogback-spring.xml
如果不介意各個環(huán)境配置都在工程中那就很方便,使用spring boot 提供的–spring.profiles.active,在啟動命令中選擇配置文件。
手工部署-前臺
cd seezoon-admin-webyarn build
產(chǎn)出物
seezoon-admin-web/dist 中文件發(fā)布到線上nginx 目錄即可,該工程nginx 配置如下,僅供參考。
upstream seezoon-admin-server { server 127.0.0.1:8080 max_fails=3 fail_timeout=10s;}server { listen 80; server_name stack.seezoon.com; rewrite ^(.*)$ https://$host$1 permanent;}server { listen 443; server_name stack.seezoon.com; ssl on; ssl_certificate /data/cert/stack.seezoon.com.pem; ssl_certificate_key /data/cert/stack.seezoon.com.key; ssl_session_timeout 5m; ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4; ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_prefer_server_ciphers on; # api location ^~ /api/ { proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Real-PORT $remote_port; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_pass http://seezoon-admin-server/; } # 文件服務(wù) location ^~ /file/ { access_log off; alias /data/upload-server/; } # 靜態(tài)資源 location / { access_log off; root /data/seezoon-admin-web/; index index.html index.htm; }}
可選靜態(tài)資源壓縮配置,放在nginx.conf http 節(jié)點下。
# 打開gzip 效果更佳gzip on;gzip_min_length 1k;gzip_buffers 4 16k;gzip_http_version 1.0;gzip_comp_level 6;gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;gzip_vary off;gzip_disable "MSIE [1-6].";
六、源碼地址
訪問一飛開源:https://code.exmay.com/