構建 React.js 應用的十佳 UI 框架，都在這了！

02-10

構建你的下一個 React.js APP，有這些優秀的 UI 框架就夠了。

1、Material-UI

一套實現 Google Material Design 的 React 組件

同時，它也是 React 的第一批 UI 工具套件之一。Material-UI 包含你需要的所有組件（甚至更多）。 Material-UI 預定義的調色板和 <MuiThemeProvider> 可配置性極高，允許為 APP 自定義顏色主題。

Material-UI 之前的版本個人認為有一些性能問題，但從 3.0 版本的發布來看，性能有所改善。

2、React Desktop

MacOS Sierra 和 Windows 10 的 React UI 組件。

如果你對跨平台桌面應用程序的 UI 組件感興趣，那麼 React-Desktop 就是為你而設。你可以在上面找到 Mac OS 和 Windows 10 的均可用 UI 組件。

React-Desktop 可與 NW.js 和 Electron.js 完美結合，也可用於任何 JavaScript 驅動的項目。

3、Semantic-UI-React

Semantic-UI 的官方 React 組件

就個人而言，我認為這是 React 最好的 UI 框架。

Semantic-UI-React 幾乎擁有 Semantic-UI 中所有有用的組件，同時也有一個非常好的 Declarative API ，和用於 React 組件的 shorthand props ，並且 jQuery-Free。

4、Ant-design

一套企業級的前端設計語言和基於 React 的前端框架實現。

官方文檔介紹：

它支持所有現代瀏覽器（IE9 以上），支持服務端渲染和 Electron 環境，擁有許多組件。

Ant-design demo

5、Blueprint

針對構建複雜、數據密集的 Web 界面的桌面應用進行了最優化。如果你重度依賴移動互動，並且正在尋找 mobile-first 的 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

一組使用 CSS 模塊實現 Google Material Design 的 React 組件。

你是否聽說過 CSS Modules? React-Toolbox 依賴於它。它允許你只使用所需的 CSS ，而不用使用像 Purify-CSS 這樣的工具。除此之外，React-Toolbox 是具有30 +組件，開箱即用的，高度可定製的框架。

8、Grommet

用於企業應用最先進的 UX 框架。

Grommet 不僅僅是一個 UX 框架，它所包含的東西要比單純的 UX 框架多得多。

Grommet = 用 React 編寫的一堆 UX 組件和工具 + 自有的 grommet-cli +「入門」指南 + 預建模板 + 良好的文檔+ 與 Sketch 集成。

9、Fabric

用於構建與 Office 和 Office 365 界面相類似的 Web 應用的 React 組件。

在過去幾年中，微軟支持並構建了許多開源項目 - Angular 2、TypeScript、VS Code 和 Fabric。

Fabric 是用 TypeScript 編寫的官方 Office 庫，包含「入門」指南、博客、官方調色板和字體，以及構建項目所需的所有組件。

10、React-md

又一個實現 Material Design 的庫。React-md 可以輕鬆地根據自己的需要進行定製，擁有良好的文檔和快速上手的「入門」指南，以及許多常見的 Material 組件。

不過現狀是，這個庫只有一個人在進行維護和開發。如果你想為開源項目做貢獻，React-md 可能是一個不錯的選擇。

編譯自：https://hackernoon.com/the-coolest-react-ui-frameworks-for-your-new-react-app-ad699fffd651

文章素材來源【開源中國社區】構建 React.js 應用的十佳 UI 框架，都在這了！