11 libraries (sets of components) for React that you should know about in 2018

Original author: Jonathan Saring
  • Transfer
11 libraries (component sets) for Angular that you should know about in 2018
11 libraries (component sets) for Vue that you should know about in 2018
11 libraries (component sets) for React worth knowing in 2018,

modern frameworks for developing web applications have formed communities around themselves whose members, among other things, are developing libraries for these frameworks. Such libraries are used in many projects. As a rule, one can even say that, for example, on pure React, Angular or Vue, without the use of additional tools, web applications today are not developed.



We present to your attention a translation of the first material from a series of articles, in each of which 11 of the most interesting libraries for different web frameworks are considered, which are worth paying attention to in 2018. Today let's talk about libraries for React.

React


If you look at the statistics on React, you get a feeling that the popularity of this framework is constantly growing. Although, if you look at the Stack Overflow data on the most popular technologies, React is inferior to Angular, but at the same time it is in the lead in the list of the most favorite technologies by developers.


React is the most favorite framework in 2017.

Virtual DOM technology and the ability to declaratively describe user interfaces, as well as the ability to model the state of interfaces and React availability for JS developers who know their job, have led many to choose this framework to create a frontend web applications.

Another significant reason for React's popularity is its component model. Components allow you to break the user interface into independent fragments suitable for reuse and consider these fragments as isolated entities.

The following is a list of eleven component libraries that will come in handy when working on React projects.

1. React Material-UI


React Material-UI is a set of React components that implement Google’s Material Design concept. Given that the Material-UI library has more than 30 thousand stars on GitHub, it is probably the most popular library for React. This library is booming, Material-UI v1 is expected.


2. React-Bootstrap


React-Bootstrap is a React-Reactable library that implements the features of Twitter’s popular Bootstrap template. She has about 11,000 stars on GitHub. Probably, she gained wide popularity due to its simplicity and ease of working with it.


3. React Toolbox


React Toolbox is a set of components for React that implement the Google Material Design specification. It is built on the basis of some very advanced technologies like CSS modules (SASS is used here), WebPack and ES6. On the library website you can find an interactive sandbox in which you can experiment with it.


4. React Belle


React Belle is a set of React components optimized for use on mobile devices and desktop PCs. The styles available here are highly customizable, which allows you to set basic styles for all components, as well as modify the style of each specific component individually. Here is a nice example of using this library.


5. React Grommet


React Grommet provides the developer with an extensive set of components, grouped according to the principle of their use. All of them are created taking into account the requirements of accessibility, cross-browser compatibility and support customization of appearance using themes.


6. React Components from Khan Academy


Khan Academy-trained React components have been released as a component library that uses embedded CSS and has comments. Individual library components can be installed using this collection , created by means of Bit.


7. Material Components Web


Material Components Web is a library developed by a team of engineers and UX designers from Google. The components included in it allow you to organize a workflow, at the output of which you can expect the appearance of attractive and functional web projects. This library replaced the react-mdl library (which is now deprecated) and has already gained about 7 thousand stars on GitHub.


8. Ant Design


The Ant Design User Interface Development Library for React is built with Ant Design specifications in mind. It includes a set of components and examples of their use. The library is written in TypeScript, it defines all the necessary types. It is designed for the frontend workflow described by the NPM + WebPack + dva scheme .


9. Semantic UI React


Semantic UI React is a library that is an official project for integrating Semantic UI and React. She has almost 5 thousand stars on GitHub, she uses NetFlix and Amazon. Semantic UI gives the developer an interesting and flexible arsenal of components.


10. Onsen UI


Onsen UI components are available in React thanks to bindings and allow you to create hybrid mobile applications based on React and the Onsen UI framework. More than 80 developers contributed to this project; on GitHub, it has about 5.6 thousand stars. All this allows us to say that Onsen UI should at least pay attention when choosing a library for developing a user interface.


11. React Virtualized


The React Virtualized project , with about 8,000 stars on GitHub, is a collection of React components designed to efficiently render large lists and tables.


About the individual components


The individual components for use in React projects can be found in the awesome-react and awesome-react-components lists . In order to break libraries into independent components that can be used in projects without the need to import the full library code into them, you can use the capabilities of Bit .

Summary


Everything indicates that in 2018 React will continue to grow in popularity, which means that we will see the development of component libraries, which will become the building blocks of many web applications.

We hope you find the libraries we talked about today useful. However, React is far from the only popular framework. Next time, read about 11 libraries for Angular.

Dear readers! If you use React, then you probably have personal lists of your favorite libraries. Please share them.


Also popular now: