后台管理系统的前端解决方案

项目地址 | https://github.com/diandian18/react-antd-console

介绍

react-antd-console 是一个后台管理系统的前端解决方案，封装了后台管理系统必要功能（如登录、鉴权、菜单、面包屑、标签页等），帮助开发人员专注于业务快速开发。项目基于 React18 、Ant design5 、Vite 和 TypeScript 等新版本。对于使用到的各项技术，会被持续更新至最新版本

谁适合使用？

如果你将要开发或学习如何开发后台管理系统。并且你是一名新手前端开发者，或者是一名了解一些前端的后端开发者，或者是一名有一定经验的前端开发者，但当下还没有信心把握所有的事情，并且希望循序渐进掌握，那么可以尝试本项目

尽可能简单

无论是使用本项目做开发，还是学习的目的，保持简单是必要的。因此本项目专注于：良好的代码层次设计、定义清晰明确的目录结构、容易改造和拆换的模块分类等。本项目最小化的封装了一些必要的功能，例如登录、鉴权、菜单、面包屑、标签页等。如果你没有自己的 UI 设计，那么可以直接使用本项目封装的功能；如果你有自己的 UI 设计，那么也可以在本项目基础上作方便的改造

功能

最新技术栈: Vite(支持热更新)、React18、Ant Design5、TypeScript(近乎100%的类型覆盖)。
专注业务: 封装好的布局(侧边菜单、面包屑、标签页、页头页脚等)，只需要专注于业务开发。
权限管理: 支持菜单级和按钮级权限。（ Pro edition ）
路由配置: 一份配置，自动生成路由、菜单、面包屑等，支持嵌套路由、单/无布局等配置，支持路由动态变化等。
数据管理: 分层（数据和视图）架构设计，数据管理方案理论上支持接入任意 UI 渲染库/框架（包括不限于 React/Vue/Angular ）
颜色换肤: 支持深/浅肤色模式下的任意颜色切换。（ Pro edition ）
风格主题: 不同的主题风格选择，如布局、菜单、标签页、面包屑、页头页脚、动画等。（ Pro edition ）
丰富组件: 如搜索表格、引导、富文本、Markdown等。（ Pro edition ）
其他功能: 如响应式设计、国际化、Mock、环境配置、工程化规范等。

快速开始

# 安装依赖
npm i

# 启动服务
npm start

浏览器访问 http://localhost:9527

构建

# 构建生产环境包
npm run build:prod

浏览器兼容

兼容支持 es2015 的浏览器，不兼容 IE ，建议不低于:

Chrome >=87
Firefox >=78
Safari >=14
Edge >=88

Pro edition

深/浅色主题


Light	Dark

任意主色切换

任意背景色切换


Background Light	Background Dark

4 种布局


侧分栏	侧单栏


头分栏	头单栏

丰富的主题配置

在线预览 | 文档

react-antd-console v1.0 发布了！