vue3.0+antdv的admin管理系统vue-admin-beautiful推荐

news2024/9/22 7:37:08

前言

几年前,笔者自学了vue这一优秀的前端框架,但苦于没项目练手,无意间发现了vue-admin-beautiful这一优秀的前端集成框架。当时就使用它做了一很有意思的小项目---终端监控云平台,实现了前端和后台的整体功能。整体方案介绍参见博文《终端出厂后自动化运维方案》,前端使用vue-admin-beautiful框架,后端使用go-zero微服务框架,几天内就搞出来了一个包含前端和后台的小项目。发现它确实好用,是我目前用过最顺手的一个前端admin管理框架,推荐给有需要的小伙伴,喜欢的可以收藏。

我的monitor-ui前端运行界面:

后续有机会介绍下我这个终端监控云平台小项目的具体实现,挺有意思的。几年前还用到过几个地方的公交客户现场,客户挺喜欢这个功能的。但由于无法跟现有的产品集成,且我我个人的业余项目,没功夫维护,销售觉得很遗憾,于是作罢。现开源出前端(vue)和后台golang源码,感兴趣的可以把前端和后台都运行起来,抽空我再介绍下如何把前端和后台都部署起来。

前端:monitor-ui: vue ui

后台:https://gitee.com/yyz116/monitor

vue-admin-beautiful介绍

vue-admin-beautiful是github开源admin中最优秀的集成框架之一,它是国内首个基于vue3.0的开源admin项目,同时支持电脑,手机,平板,默认分支使用vue3.x+antdv(ant-design-vue开发。免费开源admin项目,star高达5.9K+,是我目前用过最顺手的。

功能特性

  • 💪 40+高质量单页
  • 💅 RBAC 模型 + JWT 权限控制
  • 🌍 10 万+ 项目实际应用
  • 👏 良好的类型定义
  • 🥳 开源版本支持免费商用
  • 🚀 跨平台 PC、手机端、平板
  • 📦️ 后端路由动态渲染

官方示例效果图如下:

快速安装 

下面介绍的是vue3.0-antdv分支(ant-design-vue)
# 克隆项目

git clone -b vue3.0-antdv https://github.com/chuzhixin/vue-admin-beautiful.git

# 进入项目目录

cd vue-admin-beautiful

# 安装依赖

#这个不更新npm镜像源的话会很慢
npm install
# 或者 安装依赖
npm i --registry=http://mirrors.cloud.tencent.com/npm/
# 本地开发 启动项目
npm run serve

非常绝佳的一款免费开源Vue3中后台前端开发管理框架,作者长期更新维护,需要的不可错过。

# 演示地址 
http://chu1204505056.gitee.io/vue-admin-beautiful
# 仓库地址
https://github.com/chuzhixin/vue-admin-beautiful

其他资源

终端出厂后自动化运维方案_终端软件版本自动更新 运维系统-CSDN博客

vue-admin-beautiful: vue-admin-beautiful 是一款前端开发框架,vue 学习搭框架必备,集合了所有的 vue 技术栈 - 木兰确实

国内npm源镜像(npm加速下载) 指定npm镜像_npm 国内镜像-CSDN博客

GitHub - umicro/uView: uView UI,是uni-app生态最优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水

vue-admin-beautiful–国内首个vue3.0+antdv开源Admin管理系统-CSDN博客

【黄啊码】关于vue的PC端和手机端框架-腾讯云开发者社区-腾讯云

太酷了!这款vue3.0+antdv管理系统,我粉了!_基于vue3.0 vite 人员管理 免费框架-CSDN博客

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1679925.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

python:SunMoonTimeCalculator

# encoding: utf-8 # 版权所有 2024 ©涂聚文有限公司 # 许可信息查看: # 描述: https://github.com/Broham/suncalcPy # Author : geovindu,Geovin Du 涂聚文. # IDE : PyCharm 2023.1 python 3.11 # Datetime : 2024/5/14 21:59 # User …

在抖音做电商,没有货源,不懂直播怎么办?分享一种解决方案!

大家好,我是电商糖果 糖果做电商的时间也挺久了,天猫,京东,闲鱼都搞过。 从学校进入社会工作,创业,一直都是围绕电商打转。 做的时间久了,好像只会做这一件事儿了。 2020年开始专攻抖音小店&…

大模型日报2024-05-15

大模型日报 2024-05-15 大模型资讯 OpenAI推出全新AI模型GPT-4o,具备文本、图像和音频处理能力 摘要: OpenAI公司继ChatGPT后,最新推出了名为GPT-4o的AI模型。这一模型不仅能够理解和生成文本,还新增了图像和音频的解释及生成功能。GPT-4o作为…

思科模拟器--2.静态路由和默认路由配置24.5.15

首先,创建三个路由器和两个个人电脑。 接着,配置两台电脑的IP,子网掩码和默认网关 对Router 0,进行以下命令: 对Router进行以下命令: 对Router2进行以下命令: 本实验完成。 验证:PC…

代码随想录训练营Day 29|力扣39. 组合总和、40.组合总和II、131.分割回文串

1.组合总和 题目链接/文章讲解: 代码随想录 视频讲解:带你学透回溯算法-组合总和(对应「leetcode」力扣题目:39.组合总和)| 回溯法精讲!_哔哩哔哩_bilibili 代码:(未剪枝版 &#xf…

React Native 之 原生组件和核心组件(二)

原生组件 在 Android 开发中是使用 Kotlin 或 Java 来编写视图;在 iOS 开发中是使用 Swift 或 Objective-C 来编写视图。在 React Native 中,则使用 React 组件通过 JavaScript 来调用这些视图。在运行时,React Native 为这些组件创建相应的 …

19个测试⽤例⽣成的AI⼯具!卷起来!

在不断发展的软件开发领域中,确保应⽤程序的可靠性和功能性⾄关重要。 随着软件系统复杂性的增加,有效测试⽅法的需求也在上升。 传统的测试⽤例⽣成⽅法通常⽆法满⾜快速开发周期和复杂代码库的需求。 随着进⼊⼈⼯智能(AI)时…

ROS学习笔记(15)小车巡墙驾驶

0.前提 前一章我讲解了拉氏变换和PID,这一章我来讲解一下小车巡墙驾驶的理论和部分代码。 1.前情回顾 1.拉氏变换 拉普拉斯变换是要将时域问题转换成频域问题来处理。 2.PID控制器 转向角: 误差牺牲: 3.具体参看上一篇文章 2.巡墙驾驶…

机器学习入门介绍

各位大佬好 ,这里是阿川的博客 , 祝您变得更强 个人主页:在线OJ的阿川 大佬的支持和鼓励,将是我成长路上最大的动力 阿川水平有限,如有错误,欢迎大佬指正 目录 三大方向机器学习产生的原因机器如何学习…

Vue3学习笔记 - 禹神YYDS

1. 教程介绍 https://www.bilibili.com/video/BV1Za4y1r7KE?p1 本篇vue3,内容比较新,比如有setup语法糖用法;只是他使用TS,并不是JS;不过JS也比较熟悉了,也可以学习下TS的语法,课程使用 TypeSc…

【利用数组处理批量数据-谭浩强配套】(适合专升本、考研)

无偿分享学习资料,需要的小伙伴评论区或私信dd。。。 无偿分享学习资料,需要的小伙伴评论区或私信dd。。。 无偿分享学习资料,需要的小伙伴评论区或私信dd。。。 完整资料如下:纯干货、纯干货、纯干货!!…

再谈毕业论文设计投机取巧之IVR自动语音服务系统设计(信息与通信工程专业A+其实不难)

目录 举个IVR例子格局打开,万物皆能IVR - 把《民法典》搬上IVR IVR系统其实可盐可甜。还能可圈可点。 戎马一生,归来依然IVR。 举个IVR例子 以下是IVR系统的一个例子。 当您拨打电话进入IVR系统。 首先检验是否为工作时间。 如是,您将被送入…

STM32F407 2个高级定时器生成2路无刷电机波形以及相电流采集程序(寄存器版)

stm32f407 高级定时1、定时8 生成20k 中心PWM 波形 并分别用其通道4 触发ADC1 ADC2 采样 用于分别两无刷电机foc 电流环控制,ADC1产生50us的电流采集完成中断,用于foc算法周期运算 主要参考高级定时器的寄存器和ADC寄存器 首先,要使用STM32F…

OSG编程指南<二十三>:基于OSG+ImGui制作模型编辑器,实现三轴方向的实时平移、旋转和缩放变化

1、概述 在OSG的开发应用过程中,我们有时候总会纠结于使用MFC还是Qt来嵌入OSG窗口以便于后续的功能开发,毕竟选择一个合适的UI框架,对于后续的开发还是省去很多麻烦的。但对于初学者来说,可能对框架消息机制的不熟悉,尤…

每日复盘-20240515

仅用于记录当天的市场情况,用于统计交易策略的适用情况,以便程序回测 短线核心:不参与任何级别的调整,采用龙空龙模式 一支股票 10%的时候可以操作, 90%的时间适合空仓等待 国联证券 (1)|[9:25]|[133765万]|31.12 一…

selenium发展史

Selenium Core 2004 年,Thoughtworks 的工程师 Jason Huggins 正在负责一个 Web 应用的测试工作,由于这个项目需要频繁回归,这导致他不得不每天做着重复且低效的工作。为了解决这个困境,Jason 开发了一个运行在 JavaScript 沙箱中…

表白成功率百分百的向女朋友表白网页源代码,向女友表白HTML源代码

表白成功率百分百的向女朋友表白网页源代码&#xff0c;向女友表白HTML源代码 效果&#xff1a; 完整代码下载地址&#xff1a;向女友表白HTML源代码 <!DOCTYPE html> <!--STATUS OK--> <html><head><meta http-equiv"Content-Type" c…

Linux|基础环境开发工具使用(1)

目录 Linux 软件包管理器 yum 什么是软件包 关于 rzsz 注意事项 查看软件包 如何安装软件 如何卸载软件 Linux编辑器-vim介绍 vi与vim的相同点 vi与vim区别 Linux 软件包管理器 yum 什么是软件包 在Linux下安装软件, 一个通常的办法是下载到程序的源代码, 并进行编译…

【Windows】回忆Win98

回忆Win98&#xff0c;又看到了这个Excel界面&#xff0c;上次还是十多年前的计算机课上 1、安装环境 Win11家庭版,23H2,VMware Workstation Pro 16 , 2、安装步骤及参考 虚拟机里的硬盘设置成SATA&#xff08;否则各种错误&#xff09;&#xff0c;安装MSDOS7.1&#xff…

VP Codeforces Round 944 (Div 4)

感受&#xff1a; A~G 其实都不难&#xff0c;都可以试着补起来。 H看到矩阵就放弃了。 A题&#xff1a; 思路&#xff1a; 打开编译器 代码&#xff1a; #include <iostream> #include <vector> #include <algorithm> #define int long long using na…