七个不可错过的React组件库与开发框架
React是如今最火爆的前端技术,而React最棒的一个特点就是有大量功能丰富的组件库和开发框架可用。从按钮到卷轴到工具条,应有尽有,而且这些组件可以各行其是,也可以组装成复杂的UI,你也可以把UI分解成独立的可服用的模块。
以下IT经理网介绍几个非常重要而有用的React组件库和开发框架,方便你在现有React组件基础上快速拼装UI:
1.React Material UI
Material UI是实现谷歌拟物设计原则最流行的框架,包含大量组件,如工具条、表格、按钮、导航等等。甚至还为UI设计提供了超过900个不同的SVG图标。
2.React Bootstrap
React Bootstrap提供面向React组件的Bootstrap重构框架,Bootstrap是目前最流行的UI框架,将它与React组件合体,夫复何求?
3.React Belle
React Belle提供哦你一系列漂亮的,可配置的组件,包括开关、下拉列表框、评分、文本输入、卡片等等。这个框架引以为傲的是为桌面和移动端都做了优化的同时,也支持进行样式上的高级自定义配置。
4.React ToolBox
React Toolbox是非常流行的React组件库,包含大量拟物设计组件。React Toolbox基于最流行的方案例如CSS Modules(由SASS编写),Webpack和ES6,能够与Webpack工作流无缝集成,并且非常容易定制,也非常灵活。虽然包含多大十种组件,React Toolbox的可配置性非常高,提供绝佳的UI开发体验。
5.React Grommet
Grommet是一个非常强调体验的的React组件库,所有组件都可访问,具备跨浏览器兼容性且支持主题定制。通过对属性的配置,组件的灵活性也可以进一步提高。Grommet颜值很高,非常适合用来快速开发干净简洁,具备关键基本功能的UI。
6.Semantic UI
React Semantic UI是React官方集成的Semantic UI组件库。作为一个开发框架,Semantic可用来创建界面美观的响应式布局,支持对HTML标签或组件渲染的控制。你也无需增加额外的嵌套组件来编辑组件功能和属性。这对于同时使用MenuLinks和React-router来说非常重要。
7.React With Bit
Bit是一个非常强大的工具,可以调用任何其他应用或者代码库中找到的任何组件。Bit在你的源代码文件之上增加了一个虚拟层,帮助创建、管理和复用组件,而无需导入整个代码库。Bit会自动解析文档并在任意地点和框架中运行组件测试,这使Bit成为一个极为有用的React组件工具。在Bit community hub社区,你还能找到所需的几乎任何React UI功能。
七个不可错过的React组件库与开发框架的更多相关文章
- 如何快速构建React组件库
前言 俗话说:"麻雀虽小,五脏俱全",搭建一个组件库,知之非难,行之不易,涉及到的技术方方面面,犹如海面风平浪静,实则暗礁险滩,处处惊险- 目前团队内已经有较为成熟的 Vue 技术 ...
- React组件库
图表组件库:Recharts(React和D3构建的图表库) UI组件库:react-bootstrap
- React 组件库框架搭建
前言 公司业务积累了一定程度,需要搭建自己的组件库,有了组件库,整个团队开发效率会提高恨多. 做组件库需要提供开发调试环境,和组件文档的展示,调研了几个比较主流的方案,如下: docz 配置简单,功能 ...
- React组件库集锦及学习视频
[转载]https://www.rails365.net/articles/react-zui-hao-de-ui-zu-jian-ku-ji-jin 这里有一篇讨论,说了哪个才是 React 最好的 ...
- [翻译]怎么写一个React组件库(二)
本文同步发布于知乎专栏 https://zhuanlan.zhihu.com/p/27434018,喜欢本文的就去知乎点个赞支持下吧- 引言 该系列文章将通过创建一个组件库来引导你学习如何构建自己的组 ...
- [翻译]怎么写一个React组件库(一)
本文同步发布于知乎专栏 https://zhuanlan.zhihu.com/p/27401329,喜欢本文的就去知乎点个赞支持下吧- 引言 该系列文章将通过创建一个组件库来引导你学习如何构建自己的组 ...
- React组件库Ant Design的安装与使用
一.什么是 Ant Design 1.Ant Design 提炼自企业级中后台产品的交互语言和视觉风格 2.Ant Design 使用 TypeScript 构建,提供完整的类型定义文件 二.Ant ...
- 使用dumi生成react组件库文档并发布到github pages
周末两天玩了下号称西湖区东半球最牛逼的react文档站点生成工具dumi,顺带结合github pages生成了react-uni-comps文档站, 一套弄下来,感觉真香,现在还只是浅尝,高级的特性 ...
- 从0开始用webpack开发antd,react组件库npm包并发布
一.初始化一个npm包 1.新建一个文件夹(名称随意,建议和报名一致),输入命令 :npm init -y 会自动生成一个包的说明文件 package.json如下(本文以scroll-antd-ta ...
随机推荐
- 银行手机APP安全评估报告【转载】
猫头鹰工作室 我不相信命运,但尊敬命运 主页 大数据 Kafka Spark Hbase Redis Flume ActiveMQ 渗透测试 方法论 Kali测试 APP安全 OWASP 脑图 Too ...
- ES6中新增字符串方法,字符串模板
多了两个新方法 startsWith endsWith 返回的是一个Boolean值 let str='git://www.baidu.com/2123123'; if(str.startsWith( ...
- 20165205 2017-2018-2 《Java程序设计》 第三周学习总结
20165205 2017-2018-2 <Java程序设计>第三周学习总结 教材学习内容总结 学习类的概念(类体,成员变量,方法) 学会构造方法(默认和自定义构造方法) 学会创建.使用对 ...
- 《算法》第五章部分程序 part 1
▶ 书中第五章部分程序,包括在加上自己补充的代码,字母表类,字符串低位优先排序(桶排) ● 字母表类 package package01; import edu.princeton.cs.algs4. ...
- python中的replace
replace用于修改列表.元组.字典中的元素, 例子: 1 li = ["alec", " aric", "Alex", "To ...
- Cannot invoke Tomcat manager: socket write error
一开始, 参照 http://www.cnblogs.com/yezhenhan/archive/2012/07/17/2594684.html mvn tomcat:redeploy 出现: Can ...
- 1.maven中pom.xml文件中<exclusions>标签认不到问题
问题描述:
- MFC 如何在一个窗体中嵌套在另一个窗体中
其中的一个方法是讲子窗体设置为非模式对话框,具体操作为 :设置子窗体的border属性为none,style为 child. 在父窗体中需要用create来实现,具体例子如下. 在父窗体的OnInit ...
- mezzanine的page_menu tag
mezzanine的head 导航条.左侧tree.footer是由page_menu产生的.page_menu的算法,先计算出每一页的孩子,然后再逐页去page_menu. @register.re ...
- Centos7 Minimal 安装后 初始化配置
安装完成后初始化配置 1:更新yum yum upgrade 2: 安装基础命令 #yum -y install vim* lrzsz gcc-c++ pcre pcre-devel zlib zli ...