The top ten UI framework for building react.js applications is here!

Source: Internet
Author: User

Building your next react.js APP will suffice with these great UI frameworks.

1, Material-ui

A set of React components to implement Google Material Design

At the same time, it is one of React's first set of UI tools. Material-ui contains all the components you need (or more). Material-ui predefined palettes and <MuiThemeProvider> are highly configurable, allowing you to customize the color theme for your APP.

Material-ui Previous versions of the individual thought there were some performance issues, but from the release of the 3.0 release, performance improved.


2. React Desktop

React UI components for MacOS Sierra and Windows 10.

If you are interested in the UI components of a cross-platform desktop application, then React-desktop is for you. You can find the available UI components for Mac OS and Windows 10 above.

The react-desktop can be combined with nw.js and electron.js to be used in any JavaScript-driven project.


3, Semantic-ui-react

Semantic-ui's Official React component

Personally, I think this is the best UI framework for React.

Semantic-ui-react has almost all the useful components in Semantic-ui, as well as a very good declarative API, shorthand props for React components, and Jquery-free.


4, Ant-design

A set of enterprise-class front-end design languages and React-based front-end framework implementations.

Official Document Description:

    • An enterprise-level UI design language for WEB applications
    • A set of high-quality React components out-of-the-box
    • Build with TypeScript to provide a complete type definition file
    • Workflow based on NPM + Webpack + Babel

It supports all modern browsers (IE9 or more), supports service-side rendering and Electron environments, and has many components.

Ant-design Demo


5, Blueprint

Optimized for desktop applications that build complex, data-intensive WEB interfaces. If you rely heavily on mobile interaction and are looking for a Mobile-first UI toolkit, it may not be for you.

Blueprint is also written in TypeScript, with good documentation.

It contains 30 + React components, covering almost all common interface elements, from buttons to form controls to ToolTips, and more. It also includes CSS styles for each component and tools for designing your own components and applications using Sass and less variables, as well as an elegant palette and more than 300 UI icons in two sizes designed to keep you focused on building products.


6, React-bootstrap

React Build the Bootstrap 3 component.

React-bootstrap is a reusable front-end component library. You can get the Twitter Bootstrap experience through Facebook's react.js framework, with clearer code.

In short, this is a veteran Bootstrap component, rewritten with React.


7, React-toolbox

A set of React components that implement Google Material Design using CSS modules.

Have you ever heard of CSS Modules? React-toolbox relies on it. It allows you to use only the CSS you need without using a tool like PURIFY-CSS. In addition, React-toolbox is a highly customizable framework with 30 + components, out-of-the-box.


8, Grommet

The most advanced UX framework for enterprise applications.

Grommet is not just a UX framework, it contains much more than a simple UX framework.

Grommet = a bunch of UX components and tools written with React + own GROMMET-CLI + "Getting Started" guide + pre-built templates + good documentation + integration with Sketch.


9. Fabric

React component for building Web apps that are similar to office and Office 365 interfaces.

Over the past few years, Microsoft has supported and built many open source projects-Angular 2, TypeScript, VS Code and Fabric.

Fabric is the official Office library, written in TypeScript, with "Getting Started" guides, blogs, official palettes and fonts, and all the components you need to build your project.


10, React-md

Another library to implement Material Design. REACT-MD can be easily tailored to your needs, with good documentation and quick-to-use "Getting Started" guides, as well as many common Material components.

But the situation is that only one person in this library is doing maintenance and development. If you want to contribute to an open source project, REACT-MD may be a good choice.

The top ten UI framework for building react.js applications is here!

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.