关于前端:打造-Reactjs-App-的UI框架你知道几个

32次阅读

共计 1998 个字符,预计需要花费 5 分钟才能阅读完成。

在本文中,咱们将分享一些助你打造 React.js App 最佳的 UI 框架。它们具备你所须要的根本 React 组件,以及易用的 API,同时,在外观和体验上也十分棒。Have Fun!

1、Material-UI

基于谷歌 Material Design 设计规范的 React 组件

此外,它还是 React 的第一个 UI 套件。Material-UI 具备你所须要的所有组件(甚至更多),以及可配置性极高的预约义调色板和 <MuiThemeProvider>,帮忙你为应用程序定制相应的色彩主题。

因为 Material-UI 过来的版本中存在一些性能问题,就我集体而言,不是很称心。但自 3.0 版本公布后的反馈来看,它在性能方面已有所改善。

2、React Desktop

专为 MacOS Sierra 和 Windows 10 提供的 React UI 组件

对于 Electron 框架,我置信你曾经有所理解。如果你对跨平台桌面应用程序 UI 组件也感兴趣的话,那么 React-Desktop 相对是你的“菜”。你能够应用它轻松获取用于 Mac OS 和 Windows 10 零碎上相应的 UI 组件。

3、Semantic-UI-React

由 Semantic-UI 官网出品的 React UI 组件

就集体而言,我认为它是最好用的 React UI 框架。它是由官网基于 Semantic-UI 打造的 React 组件,它简直涵盖了 Semantic-UI 上的所有组件,而且它还有一个易用的 Declarative API,以及用于 React 组件的 shorthand props,同时它可能做到 jQuery-free。

另外,我做了一个应用 React-Semantic-UI,Webpack 构建我的项目的老手示例,你也能够来看看。

4、Ant-design

一套企业级 UI 设计语言和基于 React 实现的 Web 组件库的体验解决方案

援用官网文档介绍:

用于 Web 应用程序的企业级 UI 设计语言。

一套开箱即用的高品质 React 组件。

由 TypeScript 构建,并具备残缺定义类型。

基于 npm + webpack + dva 前端开发工作流。

它反对浏览器、服务器端渲染和 Electron 环境,并具备丰盛的组件,前端培训你还能够通过 Create-react-app 来学习。来看看 Ant-design demo 吧!

5、Blueprint

援用自官网文档:

“它将为领有简单、数据密集的 Web 界面的桌面应用程序进行全面优化。如果你重视挪动端的交互体验,并且正寻找挪动优先的 UI 套件的话,它可能不适宜你。”

Blueprint 是由 TypeScript 构建,并具备良好的应用文档。它蕴含了丰盛(30+)的 React 根底组件,从按钮到表单控件、工具提醒均有波及。

此外,它的每个组件都蕴含了 CSS 款式。

并且,你还能够应用 Sass 和 Less 变量、优雅的调色板和两种尺寸的 300+ UI 图标等工具,来打造一款专属于你的组件和应用程序。

6、React-Bootstrap

用 React 构建的 Bootstrap 3 组件

援用自官网文档:

React-Bootstrap 是一个可重用的前端组件库。通过应用 Facebook 的 React.js 框架来取得 Twitter Bootstrap 的外观与体验,以及更清晰的代码。

简而言之,它是出名的 Bootstrap 组件的 React 实现。

7、React-Toolbox

一套基于谷歌 Material Design 标准和 CSS 模块的 React 组件

你据说过 CSS Modules 吗?React-Toolbox 便依赖于它。React-Toolbox 是一个具备 30+ 开箱即用组件的高度可定制框架。从此,你能够不用应用相似 Purify-CSS 这样的工具,仅通过所需的 CSS 便能够进行我的项目的开发。

8、Grommet

用于企业应用的先进的 UX 框架

Grommet 不仅仅是 UX 框架,它还提供了从实践到利用程序开发所需的所有领导、组件以及设计资源。例如,它提供了 React 编写的丰盛的 UX 组件、自带的 grommet-cli、入门学习指南、预设模版、优良的应用文档等资源。

9、Fabric

用于为 Office 和 Office 365 构建用户体验的 React 组件

在过来的几年里,微软公司反对并创立了许多开源我的项目,例如 Angular 2、TypeScript、VS Code(基于 Electron)以及 Fabric。

Fabric 是利用 TypeScript 编写的官网 Office 库,它具备“入门”指南、博客、官网调色板和字体以及我的项目所需的所有组件。

10、React-md

这是另一个基于谷歌 Material Design 设计规范的库。React-md 具备泛滥常见的 Material 组件,你能够轻松地依据本人的需要进行定制。同时,它还具备良好的应用文档,以及疾速入门指南。

然而,目前这个库仅有一个人进行保护和开发。如果你想为开源我的项目做些奉献,或者 React-md 是一个不错的抉择。

正文完
 0