后台管理系统界面框架

后台管理系统界面框架

有的时候产品需要了解一下后台的界面设计,但是很多小公司并没有成熟的界面设计体系,这个时候我们就可以借助一些别人开发好的前端框架,来进行借鉴和研究,查看大企业是如何实现后台管理系统的。这里主要介绍几个比较出名的后台管理系统前端框架。

1. vue-element-admin

Github 地址:https://github.com/PanJiaChen/vue-element-admin
Demo体验:https://panjiachen.github.io/vue-element-admin/#/dashboard

一个基于 vue2.0 和 Eelement 的控制面板 UI 框架,这是使用vue技术栈开发的前端程序员的首选管理系统模板,模板以及非常的成熟了。

2.AdminLTE

Github 地址: https://github.com/almasaeed2010/AdminLTE
Demo体验:https://adminlte.io/themes/AdminLTE/index2.html

非常流行的基于 Bootstrap 3.x 的免费的后台 UI 框架,这是一个非常老牌的后台管理系统模板,每个页面都是单独的html网页。

3.ant-design-pro

Github 地址:https://github.com/ant-design/ant-design-pro
Demo体验:https://preview.pro.ant.design/

Ant Design Pro 是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案,致力于在设计规范和基础组件的基础上,继续向上构建,提炼出典型模板/业务组件/配套设计资源,进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。

4.ng2-admin

Github 地址:https://github.com/akveo/ngx-admin
Demo体验:https://www.akveo.com/ngx-admin/pages/dashboard

这是基于 Angular 2, Bootstrap 4 和 Webpack 的后台管理面板框架,如果使用angula框架进行前端可以试试这个后台。

5.Gentelella

Github 地址:https://github.com/puikinsh/gentelella
Demo体验:https://colorlib.com/polygon/gentelella/index.html

Gentelella 是一个可免费使用的 Bootstrap 管理界面模版,使用群体比较广泛。这个模版使用默认的 Bootstrap 3 的样式,还有一系列功能强大的 jQuery 插件和工具,可快速创建管理界面模版或者后台的 Dashboard。

6.iview-admin

Github 地址:https://github.com/iview/iview-admin
Demo体验:https://admin.iviewui.com/home

iView admin 是基于 iView 的 Vue 2.0 控制面板。搭配使用 iView UI 组件库形成的一套后台集成解决方案 。

7.blur-admin

Github 地址:https://github.com/akveo/blur-admin
Demo体验:https://www.akveo.com/blur-admin-mint/#/dashboard

BlurAdmin 是一款使用 AngularJs + Bootstrap实现的单页管理端模版,视觉冲击极强的管理后台,各种动画效果。

8.vue-manage-system

地址:https://github.com/lin-xin/vue-manage-system
Demo体验:https://lin-xin.gitee.io/example/work/#/dashboard

vue-manage-system,一个基于 Vue.js 和 element-ui 的后台管理系统模板,挺喜欢这个界面的UI,简约清晰不累赘,多功能的后台框架模板,适用于绝大部分的后台管理系统开发。

9.material-dashboard

Github 地址: https://github.com/creativetimofficial/material-dashboard
Demo体验:https://demos.creative-tim.com/material-dashboard/pages/dashboard

基于 Bootstrap 4 和 Material 风格的控制面板。Material Dashboard 是一个开源的 Material Bootstrap Admin,其设计灵感来自谷歌的 Material Design 。

10.d2-admin

github地址:https://github.com/d2-projects/d2-admin

Demo体验:https://d2.pub/d2-admin/preview/#/index

D2Admin 是一个完全 开源免费 的企业中后台产品前端集成方案,基于 vue.js 和 ElementUI 的管理系统前端解决方案 ,可以查看很多组件设计,产品可以进行参考。

11.vuestic-admin

Github:https://github.com/epicmaxco/vuestic-admin
Demo体验:https://vuestic.epicmax.co/admin/dashboard

vuestic-admin管理台仪表盘是一个响应式的仪表盘模板,采用Bootstrap 4和Vue.js构建。这个精美的管理台模板提供了自定义元素组件,如地图,聊天,个人资料卡,图标,进度条等,以及用于登录和注册的预建页面。

12.Vue vben admin

Github:https://github.com/anncwb/vue-vben-admin
Demo体验:https://vvbin.cn/doc-next

Vue Vben Admin 是一个基于 Vue3.0、Vite 、 Ant-Design-Vue 、TypeScript 构建的后台解决方案,为中大型项目开发提供开箱即用的UI框架,包括二次封装组件、utils、hooks、动态菜单、权限校验、按钮级别权限控制等功能。Vue Vben Admin 所使用的技术都是前端较新的技术栈,可以用来作为项目的启动模版,可以帮助快速搭建企业级中后台产品原型。

13.MyUI

Github:https://gitee.com/newgateway/my
Demo体验:http://newgateway.gitee.io/my

新德汇出品的基于 Element UI 的中后台项目工程框架,基于 Vue + Element UI 构建的中后台工程框架,专业美观,内置组件丰富。有大量的大屏素材和数据可视化展示形式,产品可以看看。

14.Artiely Vue Admin

Github:https://github.com/artiely/vue-admin

Demo体验:https://artiely.gitee.io/antd-admin

基于蚂蚁金服Ant Design构建的高颜值开源管理后台UI框架,继承 Ant Design 专业美观的优点,支持PC/手机/平板的响应式布局的优秀后台管理系统 UI 框架。

15.HeyUI

Github:https://github.com/heyui/heyui

Demo体验:https://admin.heyui.top

自带admin框架、中后台前端UI框架的后起之秀,一款同样优秀的前端 UI 组件库,其基于HeyUI的 admin 框架也是开箱即用的优质框架。

16.View UI

Github:https://github.com/view-design/ViewUI

Demo体验:https://adminpro.iviewui.com/dashboard/console

View UI ,即原先的 iView,一套基于 Vue 的开源 UI 组件库,主要用于 PC 界面的中后台产品。View UI 的初衷是提供高质量、功能丰富的基础组件,以及友好的 API,当然还有独树一帜的漂亮 UI。

17.EAdmin

Github:https://github.com/suruibuas/eadmin

Demo体验:http://demo.eadmin.com.cn/

基于js和原生html的纯粹后台开源前端 UI 框架。


下面是最新发现的新架构,可以借鉴学习

18.ArcoDesign

Github:https://github.com/arco-design/arco-design

Demo体验:https://arco.design/pro/preview/dashboard/workplace

字节跳动头条系企业级产品设计系统acro design开源,提供Axure、Sketch和Figma组件库。

19.semidesign

Github:https://github.com/DouyinFE/semi-design

Demo体验:https://semi.design/zh-CN/

由字节跳动抖音前端与 UED 团队设计、开发并维护,包含设计语言、React 组件、主题等开箱即用的中后台解决方案,帮助设计师与开发者打造高质量产品。

作者

Huyk

发布于

2021-10-21

更新于

2021-10-27

许可协议