Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

溢出磷火
• 阅读 9256

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

大家好,我是你们的 猫哥,一个不喜欢吃鱼、又不喜欢喵 的超级猫 ~

关于猫哥,大家可以看看我的年终总结 前端工程师的 2020 年终总结 - 3 年之痒

前言

猫哥是一个常年混迹在 GitHub 上的猫星人,所以发现了不少好的前端开源项目、常用技巧,在此分享给大家。

公众号:前端GitHub,专注于挖掘 GitHub 上优秀的前端开源项目,并以专题的形式推荐,每专题大概 10 个好项目,每周会有一到三篇精华文章推送,与时俱进版前端资源教程。

已经推荐了 面试项目CSS 奇技淫巧项目代码规范项目数据结构与算法项目JavaScript 奇技淫巧项目前端必备在线工具 等专题的近 100 个优秀项目了。

平时如何发现好的开源项目,可以看看这篇文章:GitHub 上能挖矿的神仙技巧 - 如何发现优秀开源项目

今天给大家推荐的是 Vue3 的源码中文学习教程、支持的 UI 组件库、优质实战项目。

以下为【前端GitHub】的第 16 期精华内容。

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

1. Vue3 中文文档

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

先给大家提供 3 个 Vue3 的中文学习网址。

Vue3 中文文档,国内 CDN 加速版

https://vue3js.cn/docs/zh/

Vue3 设计理念

Vue3 设计理念,动机与目的,上手必读。

https://vue3js.cn/vue-composi...

Vue3 相关项目聚合网站

https://vue3js.cn/

2. Vue3 源码

为什么要学习源码 ?

1. 阅读优秀的代码的目的是让我们能够写出优秀的代码

2. 不给自己设限,不要让你周围人的技术上限成为你的上限

其实就跟我们写作文一样,你看的高分作文越多,写出高分作文的概率就越大。

基于现在的程序员工作模式(模块化开发,只需要拿到需求做自己的部分),别说看源码,甚至就连项目里的代码都懒的去看,我认识的很多程序员就是这样的,一个项目摸了两三年,你要问他项目中 webpack 都干了哪些事情,他的回答是不知道,反而趾高气扬的告诉你,那些他从来都用不上,看了也没什么用,也看不懂,这里省略内心千字脏文。

阅读主要目的 是为了帮助我们 积累素材,不要书到用时方恨少,看到美女我们应该能有一万种词语去形容,如气若幽兰,美艳不可方物,一笑倾城,再笑倾国,世间尤物,而不是简短的几个字,我艹,美女!

https://vue3js.cn/start/

3. UI 组件库

Ant-design-vue

ant-design-vue 是 Ant Design 的 Vue 实现,组件的风格与 Ant Design 保持同步, 目前支持 Vue 3.0 的 2.0.0 测试版 已发布。

https://antdv.com/docs/vue/in...

Vant 3.0

轻量、可靠的移动端 Vue 组件库。

Vant 是有赞前端团队开源的移动端组件库,于 2016 年开源,已持续维护 4 年时间。

目前 Vant 已完成了对 Vue 3.0 的适配工作,并发布了 Vant 3.0 版本

https://vant-contrib.gitee.io...

Element-plus

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

Element Plus,一套为开发者、设计师和产品经理准备的基于 Vue 3.0 的桌面端组件库。

https://element-plus.org/#/zh-CN

element 3

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

Element 3,一套为开发者、设计师和产品经理准备的基于 Vue 3.0 的桌面端组件库。

https://github.com/hug-sun/el...

4. 实战项目

vue-vben-admin

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

基于 ant-design-vue,typescript,vue3.0,vite 实现的 vue3 风格的后台管理系统。

https://github.com/anncwb/vue...

vue-admin-beautiful

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

基于 vue3.0 的开源 admin 项目,同时支持电脑,手机,平板,🔥🔥🔥默认分支使用vue3.x+antdv 开发,master 分支使用的是 vue2.x+element 开发。

https://github.com/chuzhixin/...

vue-cli

基于 Vue3.0 Composition Api 快速构建实战项目

https://github.com/Wscats/vue...

movie-trailer

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

Vue3 + TypeScript 开发的电影预告片 webAPP,可以查看正在热映与即将上映的电影信息和短片。

https://github.com/lhz960904/...

newbee-mall-vue3-app

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

newbee-mall 项目是一套电商系统,包括 newbee-mall 商城系统及 newbee-mall-admin 商城后台管理系统,基于 Spring Boot 2.X 和 Vue 以及相关技术栈开发。

前台商城系统包含首页门户、商品分类、新品上线、首页轮播、商品推荐、商品搜索、商品展示、购物车、订单结算、订单流程、个人订单管理、会员中心、帮助中心等模块。 后台管理系统包含数据面板、轮播图管理、商品管理、订单管理、会员管理、分类管理、设置等模块。

https://github.com/newbee-ltd...

vue3-jd-h5

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

🔥 基于 vue3.0.0 ,vant3.0.0,vue-router4.0.0-0, vuex^4.0.0-0,vue-cli3,mockjs,仿京东淘宝的,移动端 H5 电商平台!

https://github.com/GitHubGanK...

最后

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

关于猫哥,大家可以看看 前端工程师的 2020 年终总结 - 3 年之痒,看看猫哥的脸都被打歪的 😂。

不知不觉,已经写到第 16 期了呢,已经分享超过 200 个好的前端项目了呢,往期精文请看下方宝藏仓库,点击很危险,请慎入!

https://github.com/FrontEndGitHub/FrontEndGitHub

平时如何发现好的开源项目,可以看看这两篇文章:如何在 GitHub 上发现优秀开源项目如何使用 GitHub 进行精准搜索的神仙技巧

可以加超级猫的 WX:CB834301747 ,一起闲聊前端。

微信搜 “前端GitHub”,回复 “电子书” 即可以获得 160 本前端精华书籍哦。

Vue3 的学习教程汇总、源码解释项目、支持的 UI 组件库、优质实战项目

往期精文

点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
双十一预售活动分析
2022年双十一促销活动已经开始,大家应该都提前开始关注今年双十一活动的时间表了吧?2022年10月24日晚8:00天猫双11预售时间,第一波销售时间10月31日晚8:0,第二波销售时间11月10日晚8:00;天猫双11的优惠力度是跨店每满30050
马丁路德 马丁路德
4年前
推荐程序员必备的 10 大 GitHub 仓库,前端占了 7 个!
大家好,我是你们的猫哥,一个不喜欢吃鱼、又不喜欢喵的超级猫关于猫哥,大家可以看看我的年终总结前端工程师的2020年终总结乾坤未定,你我皆黑马(https://github.com/biaochenxuying/blog/issues/79)。前言初级前端与高级前端之间,很大原因就是投入学习前端的时间、经验的差别,其实就
可莉 可莉
3年前
10 个 GitHub 上最火的程序员简历项目,2021 金三银四必备!
!(https://oscimg.oschina.net/oscnet/61ae17c16e9349a7a061c53d83b32374.jpg)大家好,我是你们的猫哥,一个不喜欢吃鱼、又不喜欢喵的超级猫~前言猫哥是一个常年混迹在GitHub上的猫星人,所以发现了不少好的前端开源项目、常用技巧,在此分享给大家。
Wesley13 Wesley13
3年前
FLV文件格式
1.        FLV文件对齐方式FLV文件以大端对齐方式存放多字节整型。如存放数字无符号16位的数字300(0x012C),那么在FLV文件中存放的顺序是:|0x01|0x2C|。如果是无符号32位数字300(0x0000012C),那么在FLV文件中的存放顺序是:|0x00|0x00|0x00|0x01|0x2C。2.  
Wesley13 Wesley13
3年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Wesley13 Wesley13
3年前
PHP创建多级树型结构
<!lang:php<?php$areaarray(array('id'1,'pid'0,'name''中国'),array('id'5,'pid'0,'name''美国'),array('id'2,'pid'1,'name''吉林'),array('id'4,'pid'2,'n
可莉 可莉
3年前
10 个 GitHub 上超火和超好看的管理后台模版,后台管理项目有着落了
!(https://oscimg.oschina.net/oscnet/4cb08f997ee74ede96b7e9ebb6bed0d6.png)大家好,我是你们的超级猫,一个不喜欢吃鱼、又不喜欢喵的超级猫~!(https://oscimg.oschina.net/oscnet/4b0a324e56d540b991be0
Wesley13 Wesley13
3年前
Java日期时间API系列36
  十二时辰,古代劳动人民把一昼夜划分成十二个时段,每一个时段叫一个时辰。二十四小时和十二时辰对照表:时辰时间24时制子时深夜11:00凌晨01:0023:0001:00丑时上午01:00上午03:0001:0003:00寅时上午03:00上午0
Wesley13 Wesley13
3年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
美凌格栋栋酱 美凌格栋栋酱
5个月前
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(