gpt4 book ai didi

Kagol:2022年最值得推荐的前端开源文章

转载 作者:我是一只小鸟 更新时间:2022-12-24 06:31:06 28 4
gpt4 key购买 nike

大家好,我是 Kagol, Vue DevUI 作者,从2020年开始一直专注于前端开源组件库的建设,在前端开源组件库、开源社区运营方面积累了一些经验,2020年主要的创作也是围绕前端组件库和开源两个主题展开.

我的组件设计积木理论

我觉得界面开发就像搭积木一样有趣,开发之前先把界面拆分成分层的多个模块,然后自顶向下用一个个积木进行拼接,其中最关键的就是组件的设计.

因此我将自己的组件设计观沉淀成了四篇小文,以 Carousel 走马灯组件为例进行深入浅出的阐述.

第一篇是总纲,介绍理论 。

  • 前端开发的积木理论——像搭积木一样做前端开发

第二篇是基于理论的实现 。

  • 用积木理论设计一个灵活好用的Carousel走马灯组件

第三篇是延伸,解释为什么要设计子组件 。

  • CarouseIndicator 组件应用:0行JS代码实现好看的手风琴式折叠卡片效果

第四篇以应用收尾,通过丰富的使用场景描述积木理论的强大 。

  • 用积木理论设计的Carousel组件都有哪些有趣的玩法?

四篇文章层层递进,深入浅出,虽然短小,但是五脏俱全,自成闭环.

开源组件库的沉淀

Vue DevUI 开源组件库组件的设计基本遵循积木理论,这个组件库是100多位社区开发者一起齐心协力完成的,前期肯定会有一些不统一的地方,不过经过持续的磨合和沟通,目前已经基本保持了一致的风格.

这期间也沉淀了不少 Vue3、Vite、TypeScript、JSX、ESLint 等方面的经验.

点赞最多(👍289点赞)的是以下这篇 Vue3 中使用 JSX 指南:

  • 前端Vuer,请收下这份《Vue3中使用JSX简明语法》

还有一篇是 ESLint 相关的:

  • 前端Vuer,请给你的项目加上 ESLint

以上两篇都是从 Vue DevUI 组件库的开源实践中沉淀下来的.

还有一篇是当时田主大会分享整理的文字版本:

  • 从 CDK Tree 源码学习如何开发一个UI无关的 Tree 组件

还有几篇分析组件设计和实现原理的,是我们田主们的投稿.

有一篇分析 Tree 组件搜索功能实现原理的,是 daviForevel 同学的投稿:

  • 手把手教你实现 Tree 组件搜索过滤功能,干货满满!

分析细粒度骨架屏组件设计原理的,是 ivestszheng 同学的投稿:

  • 骨架屏优化——细粒度模式的实现

详解 Ripple 水波纹组件实现原理的,是 ErKeLost 同学的投稿:

  • Ripple:这个广受好评的水波纹组件,你不打算了解下怎么实现的吗?

还有一些是搭建组件库的实践文章,也是我们的田主写的:

  • vaebe 同学的 从零到一建立属于自己的前端组件库
  • 还是 vaebe 同学的 你有没有好奇过vue文档的检索是怎么实现的?
  • GaoNeng 同学的 包教包会 - 手把手为组件库支持volar

还有一些零散的总结:

  • 介绍 Vue 优势的 老板:你为什么要选择 Vue?
  • git rebase 变基操作的 好慌,我代码没了!不会是变基变出问题了吧?

不得不说,开源是一个巨大的宝库,如果你能好好利用,他能大大扩展你的技术视野,掌握你在平时开发业务时很难有机会掌握的技能,这些技能可以让你从另一个高度开发业务开发.

而且开源和公司开发最大的不同在于:开源是完全自由的,你可以随意根据自己的兴趣爱好选择要学习的项目和技术,并且有一帮志同道合的朋友和你一起成长,参与开源的经历会成为你编程人生很值得回忆的一段时光.

至少对我是如此.

一个开源社区运营小白的开源经验总结

2022年的年中总结我没有像以往那样仅仅罗列一堆花里胡哨的数据,而是花了很大篇幅总结我自己从一个开源小白,到慢慢感受到开源的魅力,我的所思所想.

  • 我的开源思考

主要阐述我对开源动机、开源贡献、开源协作等的理解.

另外我还首次系统性地总结了我对于从0到1运营一个开源项目的理解,本来这篇文章要投稿到开源中国主办的《开源观止》10月刊的,结果《开源观止》从6月份到9月份发了4月份就停刊啦,很遗憾没有发布出来.

  • DevUI 开源经验:从启动开源项目到运营开源社区

不过很幸运的是,我在做开源项目中总结的经验,有机会在中国开源年会成都分会场现场给大家进行分享,分享完 Raye 整理了一份文字稿.

  • 从0到1开始运营你的开源项目——华为云DevUI成长经验分享

除了开源社区运营经验的分享,还写了好多版本推广文章.

Vue DevUI 的有3篇:

  • 303点赞👍 Vue DevUI 1.0 正式发布🎉
  • 174点赞👍 Vue DevUI:100多位贡献者持续530多天,写了近60000行代码,这个新鲜出炉的 Vue3 组件库你不想尝试下吗?
  • Vue DevUI v1.4 版本发布:从体验、效率、质量三个方面做了全方位的优化🎉

Ng DevUI 的有3篇:

  • Ng DevUI 周下载量突破1000啦!🥳
  • Ng DevUI 14 released!🎉
  • Angular DevUI 14.1.0版本已发布,快来看下都有哪些变化吧~🎉

React DevUI 的有2篇:

  • React DevUI:React 18 还没正式发布,我们已经开发了一个基于 React 18 的组件库
  • React DevUI 18.0 正式发布🎉

以及一些组件库周边的文章,比如:

  • 主题定制的相关的 20行代码,给你的项目增加 DevUI 主题切换能力
  • 规范相关的 如何在1分钟之内创建一个符合规范的DevUI组件
  • 测试相关的 请收下这份《Vue DevUI 公开测试参考指南》
  • 开源趣事的 差两个像素让我很难受,这问题绝不允许留到明年!

最后推荐下我自己的2022年开源总结,写了两个周末才写完的,请大家帮忙点个赞,谢谢! 。

把时间沉淀到自己的热爱里 | Kagol 的 2022 开源年终总结 。

另外,我正在参加掘金年度人气作者打榜活动,欢迎大家来捧场支持🤝争取进个前50💪 。

https://rank.juejin.cn/rank/2022/writer/1504599026445150 。

--- END --- 。

我是 Kagol,如果你喜欢我的文章,可以给我点个赞,关注我的掘金账号和公众号  Kagol ,一起交流前端技术、一起做开源! 。

最后此篇关于Kagol:2022年最值得推荐的前端开源文章的文章就讲到这里了,如果你想了解更多关于Kagol:2022年最值得推荐的前端开源文章的内容请搜索CFSDN的文章或继续浏览相关文章,希望大家以后支持我的博客! 。

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com