序言
项目现已全面开源,商业用途完全免费!
当前版本:v0.6.3。
如果喜欢这个项目或支持作者,欢迎Star、Fork、Watch
一键三连 🚀!!
在构建此代码框架的过程中,我已投入了大量精力,力求使其功能完善、结构清晰。然而,鉴于个人技术水平和经验的限制,框架中可能存在一些问题或可以改进的地方。对于任何可能的缺陷或不足,我在此表示诚挚的歉意,并恳请各位给予谅解。 我非常期待收到您的反馈和建议,您的每一条意见都是帮助我改进框架、提升技术水平的宝贵资源。让我们共同协作,不断优化和完善这个框架。 感谢您的使用与支持,期待与您的交流和合作!
简介
接触了很多优秀的开源和闭源项目,在使用过程中也发现一些问题,不甘满足的我遂产生了想法:于是利用休息时间编写了一套后台管理系统,它灵活、简洁、高效,拥抱最新的技术,因此Sz-Admin便诞生了,也意为升职Admin,升职加薪节节高。
Sz Admin ,一个基于 Spring Boot 3、Vue 3 和 Element-Plus 的开源中后台管理框架,致力于为您提供一个流畅、直观且功能强大的开发框架。它不仅融合了最新的技术趋势,而且通过精心设计,确保了系统的简洁性和高效,让使用者可以专注业务。
在线体验
- 官网地址:https://szadmin.cn
- 文档地址:https://szadmin.cn/md/Help/doc/start.html
- 预览地址:https://preview.szadmin.cn
- 代码仓库:
- 前端:
- 后端:
- Github:sz-boot-parent
- Gitee:sz-boot-parent
- 部署:
快速开始
基础环境:
后端运行
服务运行非常简单!!
第一步:源码下载
::: code-group
git clone https://github.com/feiyuchuixue/sz-boot-parent.git
git clone https://gitee.com/feiyuchuixue/sz-boot-parent.git
:::
第二步:导入项目
这里使用的是idea
第三步:依赖安装
maven依赖导入。为了加快下载速度,在根pom配置了aliyu镜像加速,建议根据各自的网络环境灵活处置(如不需要注释即可)。
<repositories>
<repository>
<id>public</id>
<url>https://maven.aliyun.com/repository/public</url>
<releases>
<enabled>true</enabled>
</releases>
<snapshots>
<enabled>true</enabled>
</snapshots>
</repository>
<!-- 配置官方Maven中央仓库 -->
<repository>
<id>central</id>
<url>https://repo1.maven.org/maven2</url>
<releases>
<enabled>true</enabled>
</releases>
<snapshots>
<enabled>false</enabled> <!-- 通常中央仓库不包含snapshots -->
</snapshots>
</repository>
</repositories>
第四步:修改配置文件
[!IMPORTANT]重要提示!
在resources/config 路径下,我们发现存在多个文件目录,它们分别是:
name 描述 dev 开发环境 local 本地环境 preview 预览/测试环境 prod 正式环境 详见配置。
- 打开
sz-service
->sz-service-admin
->resources
->local
目录 - 打开
mysql.yml
和redis.yml
, 修改配置。
在这里需要先创建数据库[如:创建数据库sz_admin_preview](无需导入数据脚本,项目启动会自动检查并创建),推荐使用utf8mb4
字符集。而后根据数据库信息修改jdbc配置。
修改mysql连接信息:
## mysql.yml
spring:
datasource:
driver-class-name: com.mysql.cj.jdbc.Driver
url: jdbc:mysql://127.0.0.1:3306/sz_admin_preview?useUnicode=true&characterEncoding=UTF-8&serverTimezone=GMT%2B8&useSSL=false&allowPublicKeyRetrieval=true // [!code highlight] // [!code focus] // [!code warning]
username: root // [!code highlight] // [!code focus] // [!code warning]
password: Yanfa2023@ // [!code highlight] // [!code focus] // [!code warning]
hikari:
#连接池名
pool-name: HikariCP
#最小空闲连接数
minimum-idle: 5
# 空闲连接存活最大时间,默认10分钟
idle-timeout: 600000
# 连接池最大连接数,默认是10
maximum-pool-size: 10
# 此属性控制从池返回的连接的默认自动提交行为,默认值:true
auto-commit: true
# 此属性控制池中连接的最长生命周期,值0表示无限生命周期,默认30分钟
max-lifetime: 1800000
# 数据库连接超时时间,默认30秒
connection-timeout: 30000
# 连接测试query
connection-test-query: SELECT 1
修改redis连接信息:
## redis.yml
spring:
data:
redis:
#单机配置
host: 127.0.0.1 // [!code highlight] // [!code focus] // [!code warning]
port: 6379 // [!code highlight] // [!code focus] // [!code warning]
# 数据索引
database: 0
# 连接超时时间(毫秒)
timeout: 50000
###连接池配置###
jedis:
pool:
# 连接池最大连接数(使用负值表示没有限制)
max-active: 100
# 连接池最大阻塞等待时间(使用负值表示没有限制)
max-wait: -1
# 连接池中的最大空闲连接
max-idle: 30
# 连接池中的最小空闲连接
min-idle: 10
password: 123456 // [!code highlight] // [!code focus] // [!code warning]
# 开启redis监听
redis:
listener:
enable: true
至此,已经完成全部准备工作!
第五步:启动!
运行com.sz.AdminApplication.java
启动文件
启动成功信息如下:
2024-05-14 19:42:10.871 INFO 31360 --- [admin-service] [ main] c.sz.platform.listener.AppStartListener : ===================== app is running finish ... =====================
__ _
| ] (_)
.--. ____ ______ ,--. .--.| | _ .--..--. __ _ .--.
( (`\] [_ ]|______|`'_\ : / /'`\' | [ `.-. .-. | [ | [ `.-. |
`'.'. .' /_ // | |,| \__/ | | | | | | | | | | | | |
[\__) )[_____] \'-;__/ '.__.;__][___||__||__][___][___||__]
------------------https://szadmin.cn (v0.6.0 Beta)-------------------
验证
访问 http://127.0.0.1:9991/api/admin/doc.html#/home
,展示如下页面,搭建完成!!!
前端运行
第一步:源码下载
::: code-group
git clone https://github.com/feiyuchuixue/sz-admin.git
git clone https://gitee.com/feiyuchuixue/sz-admin.git
:::
第二步:导入项目
同上
第三步:依赖安装
# 安装pnpm
npm install pnpm -g
# 进入到项目根路径,运行以下命令,安装依赖
pnpm install
第四步:创建local环境
在项目根目录下创建 .env.development.local
文件,并添加如下内容
# 本地环境
VITE_USER_NODE_ENV=development
# 公共基础路径
VITE_PUBLIC_PATH=/
# 开发环境接口地址
VITE_API_URL=http://127.0.0.1:9991/api
# 授权的clientID
VITE_APP_CLIENT_ID ="195da9fcce574852b850068771cde034"
## 启用WebSocket连接
## 若需启用WebSocket,请设置VITE_SOCKET_URL为有效的WebSocket地址
## 若不设置或留空,WebSocket功能将不会启用。例:
# VITE_SOCKET_URL=ws://127.0.0.1:9993/socket
第五步:启动!
打开命令行,执行 pnpm dev
,项目很快启动,并弹出窗口!! 你没看错,它只用了834ms!!!这就是vite!!
VITE v4.5.2 ready in 834 ms
➜ Local: http://localhost:9848/
➜ Network: http://10.255.0.1:9848/
➜ Network: http://192.168.100.176:9848/
➜ Network: http://192.168.56.1:9848/
➜ press h to show help
输入账号密码admin/sz123456
,进入home页。
注:常用命令
# 运行dev环境
pnpm dev
# 打包
pnpm build
# ts类型检查
pnpm type-check
# es-lint 检查
pnpm lint
# 格式化
pnpm format