分享 Campo UI - 一个 Material Design 的前端组件库

Rei · 2020年04月12日 · 最后由 oatw 回复于 2020年04月16日 · 6315 次阅读

我也搞了一个前端组件库啦!

做 Web 开发以来做了不少项目,也用过一些组件库(主要是 Bootstrap)。因为希望自己的项目有点个性,所以总要做一些样式定制。基于现成的库修改要覆盖很多样式,感觉很不爽,就好像一副画已经上好底色然后要改成不同风格,还不如从头画起。后来我就开始自己写 UI 样式,遇到的问题没有想象的多,解决问题的过程也积累了知识。然后我每次开项目都从 UI 组件开始写起,感觉到了重复劳动,于是产生抽出一个组件库的想法。

之前在论坛上看到有人发布了前端组件库,我就决定了自己也要弄一个 UI 库。经过一段时间开发,现在已经有了第一个可用版,项目链接如下:

文档: https://ui.getcampo.com/
源码: https://github.com/getcampo/campo-ui

因为这个库首要目的是自用,所以不推荐大家用在正式项目,我也不能保证项目持续推进和修复 Bug。如果是快速搭建商业原型,我建议还是用 Bootstrap 之类成熟框架,他们经过很多项目考验,有兼容性测试,不至于产品上线后掉坑里。

项目还在初级阶段,我打算慢慢实现 Material Design 里的更多组件和交互效果。如果看到有样式错误的欢迎提交 issus,有技术问题的也欢迎回帖交流。

Just for fun!

我的选择是,选择更认可对方理念的 UI 库,然后基于此做 定制和扩展。目前选择的是 bulma。 吃透了对方的源码之后,感觉都跟自己写的库差不多了。

👍 在小程序横行的今天,想多嘴问一下一般楼主用 UI 框架来做些什么有趣的东西?

哈哈哈!掌门的魔爪已经伸向前端界了。支持一波!

mingyuan0715 回复

这是更务实的选择。

lanzhiheng 回复

不知道呢,还在想。搞出这个库下次建项目就可以更快速搭建原型了。

Rei 回复

也是,有个趁手的工具很重要,先关注一下。

厉害了,前后端通吃。👏

不用 bootstrap 了,转用 https://tailwindcss.com/

daqing 回复

虽然没深入研究过,但 tailwind 也挺不错的。不过直观感觉是它和 bootstrap 不是一类东西,介于 tailwind 的设计思路,它的 class 实在是太多了😂 记不太住。。。

如果能够在以 utility first 的理念为核心的基础上,再来一层抽象度高一点的封装,把常用的组件来个基本样式可能会更好。官方的付费 ui 还是有点小贵的呀。

需要 登录 后方可回复, 如果你还没有账号请 注册新账号