5个好用的React UI框架

r囧r小猫 2022-09-06 10:19 327阅读 0赞

React是一个用于构建用户界面的JavaScript库，主要用于构建UI，很多人认为React 是 MVC 中的 V(视图)。

它最早起源于Facebook的一个内部项目，因为公司对当时现有的JavaScript MVC框架都不满意，就决定自己开发一套，用来架设Instagram的网站。开发完成后，发现这套东西很好用，就在2013年5月开源了。

![e70b395a4cf4bf80e43069db7dc79d7d.png][]

##### 1：Ant-design #####

推荐指数：star:60.2k  
官网：[https://ant.design/docs/react/introduce-cn][https_ant.design_docs_react_introduce-cn]  
Github: [https://github.com/ant-design/ant-design/][https_github.com_ant-design_ant-design]

Ant Design一套企业级 UI 设计语言和 React 组件库，基于Ant Design 设计体系的 React UI 组件库，用于研发企业级中后台产品，风格素雅简洁，喜欢的可以选择使用，目前在react技术栈领域使用的较为广泛，各种文档也比较齐全，遇到问题好解决。

![bd2f8177171057834eec9f3df13c02bd.png][]

图片

##### 2：Material-UI #####

推荐指数：star:57.9k  
英文文档：[https://material-ui.com][https_material-ui.com]  
Github: [https://github.com/mui-org/material-ui][https_github.com_mui-org_material-ui]

Material-UI当下流行的 React UI 框架，组件用于更快速、更简便的 web 开发，适合小团队，或者个人项目快速搭建前端界面，可以自定义主题，Github上面的star挺多的，有超过Ant的趋势，有空的话可以读一读源码，毕竟这么优秀的框架，能学到很多东西。

![9f96dcfc31b4c38f58824ccc83118694.png][]

图片

##### 3：Semantic UI #####

推荐指数：star:48k  
中文文档：[https://zijieke.com/semantic-ui/][https_zijieke.com_semantic-ui]  
Github: [https://github.com/semantic-org/semantic-ui/][https_github.com_semantic-org_semantic-ui]

Semantic UI 是一款非常优秀的前端开发框架。它在用户体验的设计上与Bootstrap和Foundation相比,更胜一筹，语义化的前端 UI 框架，包含 50 多个组件。

![03cee71e2a3b9648af3517fb81de3fc9.png][]

图片

##### 4：React-Bootstrap #####

推荐指数：star:17.7k  
官网：[https://react-bootstrap.github.io][https_react-bootstrap.github.io]  
中文文档: [http://react.tgwoo.com][http_react.tgwoo.com]  
Github: [https://github.com/react-bootstrap/react-bootstrap/][https_github.com_react-bootstrap_react-bootstrap]

一款基于ReactJS对Bootstrap进行封装前端组件库，React-Bootstrap是可重用的前端组件库。样式组件依赖于bootstrap。与 Twitter Bootstrap 一致外观与感受，但通过 Facebook 的 React.js 框架获得更清爽的代码。

![345f840ee1bdf558b9e12e960413cfc6.png][]

图片

##### 5：Blueprint #####

推荐指数：star:16.2k  
官网：[https://apiblueprint.org][https_apiblueprint.org]  
Github: [https://github.com/palantir/blueprint][https_github.com_palantir_blueprint]

Blueprint是一个基于React的Web工具组件库。 它针对在现代浏览器和IE11中运行的桌面应用程序构建复杂，数据密集的Web界面。一个 React UI 工具组件库。

![e0d45905607cbf2d806af22ffe52de19.png][]

图片

[e70b395a4cf4bf80e43069db7dc79d7d.png]: /images/20220829/2cf5eef21ce44a73bc4d97eab0bd42eb.png
[https_ant.design_docs_react_introduce-cn]: https://links.jianshu.com/go?to=https%3A%2F%2Fant.design%2Fdocs%2Freact%2Fintroduce-cn
[https_github.com_ant-design_ant-design]: https://links.jianshu.com/go?to=https%3A%2F%2Fgithub.com%2Fant-design%2Fant-design%2F
[bd2f8177171057834eec9f3df13c02bd.png]: /images/20220829/581b3d2ee575433fad05d56881019251.png
[https_material-ui.com]: https://links.jianshu.com/go?to=https%3A%2F%2Fmaterial-ui.com
[https_github.com_mui-org_material-ui]: https://links.jianshu.com/go?to=https%3A%2F%2Fgithub.com%2Fmui-org%2Fmaterial-ui
[9f96dcfc31b4c38f58824ccc83118694.png]: /images/20220829/b7439f918758426e898d1a3306d29ffb.png
[https_zijieke.com_semantic-ui]: https://links.jianshu.com/go?to=https%3A%2F%2Fzijieke.com%2Fsemantic-ui%2F
[https_github.com_semantic-org_semantic-ui]: https://links.jianshu.com/go?to=https%3A%2F%2Fgithub.com%2Fsemantic-org%2Fsemantic-ui%2F
[03cee71e2a3b9648af3517fb81de3fc9.png]: /images/20220829/195486dfd554473096a052e077b8cb11.png
[https_react-bootstrap.github.io]: https://links.jianshu.com/go?to=https%3A%2F%2Freact-bootstrap.github.io
[http_react.tgwoo.com]: https://links.jianshu.com/go?to=http%3A%2F%2Freact.tgwoo.com
[https_github.com_react-bootstrap_react-bootstrap]: https://links.jianshu.com/go?to=https%3A%2F%2Fgithub.com%2Freact-bootstrap%2Freact-bootstrap%2F
[345f840ee1bdf558b9e12e960413cfc6.png]: /images/20220829/dc7e48bd89dd4bc5875255b8728ce907.png
[https_apiblueprint.org]: https://links.jianshu.com/go?to=https%3A%2F%2Fapiblueprint.org
[https_github.com_palantir_blueprint]: https://links.jianshu.com/go?to=https%3A%2F%2Fgithub.com%2Fpalantir%2Fblueprint
[e0d45905607cbf2d806af22ffe52de19.png]: /images/20220829/fa6f31cf7e74445d901d1bb4e4c1a54a.png