Over the years, React has evolved with over 150% growth in 2018/2019.
A lot of React Core Users even consider it a language rather than a Javascript Library.
In this article, I would be explaining to you 30 React Components or better still called React Libraries, which allows you to extend your app functionalities.
1. React Border Wrapper
This is a simple component that enables you to add borders to your elements easily.
2. React Magic
React-Magic is a library that uses React to inject AJAX-loading goodness into plain old HTML webpages, without having to write any custom JavaScript. You can even use CSS transitions between the pages.
3. React Toolbox
React Toolbox is a set of React components that enforces Google’s Material Design specification. It’s powered by CSS Modules and integrates with all module bundler.
4. React Responsive
Creating responsive UI with CSS media queries in react
5. Omniscient
A library providing an abstraction for React components that allows for fast top-down rendering embracing immutable data for js. Omniscient is all about making composable UIs in a functional manner. Having pure, referentially transparent components that gives a simpler static mental model, much like the static HTML – but bringing the views in a more powerful context in a programming language.
6. TouchstoneJs
React Based Framework for Mobile App Development
7. State Tropper
Centrally manage state for React applications with Content Security Policy (CSP)
8. Preact
Fast 3kB React alternative with the same modern API. Components & Virtual DOM. It is a Highly optimized diff algorithm and seamless hydration from Server Side Rendering, Supports all modern browsers and IE11+, and Transparent asynchronous rendering with a pluggable scheduler.
9. Riot
Simple and elegant component-based UI library, Riot brings custom components to all modern browsers. It is designed to offer you everything you wished native the web components API looked like.
10. Maple.js
Maple.js is a React web components based framework mixing ES6 with Custom Elements, HTML Imports, and Shadow DOM. It has in-built support for SASS and JSX, including a Gulp task for vulcanizing your project.
11. React Icons
SVG react icons of popular icon packs
12. React Open Doodles
A Free Set of Sketchy Illustrations provided by opendoodles
13. Keo
Plain functions for a more functional Deku approach to creating stateless React components, with functional goodies such as compose, memoize, etc. Keo has taken on a more fundamental interpretation of React where components are expected to be passed immutable properties — and state is entirely inaccessible, as is setState to prevent components from holding their own state.
14. Bit
Bit is an open-source cli tool for collaborating on isolated components across projects and repositories.
Use Bit to distribute discrete components from a design library or a project into a standalone reusable package and utilize it across applications.
15. Reactivesearch
React, React Native and Vue UI components for building data-driven apps with Elasticsearch. ReactiveSearch is an Elasticsearch UI components library for React and React Native. It has 25+ components consisting of Lists, Ranges, Search UIs, Result displays and a way to bring any existing UI component into the library.
16. Slate
A completely customizable framework for building rich text editors. Slate lets you build rich, intuitive editors like those in Medium, Dropbox Paper or Google Docs—which are becoming table stakes for applications on the web—without your codebase getting mired in complexity.
17. React Json Schema
Configure and build views using JSON schemas mapped to React components, Construct React elements from JSON by mapping JSON definitions to React components. Use react-json-schema for data-driven layouts, or as an abstraction layer for React components and props.
18. Compose State
Compose multiple setState or getDerivedStateFromProps updaters in React. compose-state works with the standard setState parameters – objects or functions – so you don’t have to learn any new syntax. It’s also compatible with React’s new getDerivedStateFromProps lifecycle method.
19. React Helmet
A document head manager for React. This reusable React component will manage all of your changes to the document head. Helmet takes plain HTML tags and outputs plain HTML tags. It’s dead simple, and React beginner-friendly.
20. Clearx
ClearX is an alternative way to Redux and MobX to maintain the application state and provides a simple interface to bind it to UI components. It works with React class components and Function UI components. UI components re-render automatically when bound data changes.
21. React Snap
Zero-configuration framework-agnostic static prerendering for SPAs, Pre-renders a web app into static HTML. Uses Headless Chrome to crawl all available links starting from the root. Heavily inspired by prep and react-snapshot, but written from scratch. Uses best practices to get the best loading performance.
22. Draftjs
A React framework for building text editors, Draft.js is a JavaScript rich text editor framework, built for React and backed by an immutable model. it is Extensible and Customizable, has a Declarative Rich Text and is an Immutable Editor State
23. Refract
Harness the power of reactive programming to supercharge your components, Handle your component effects and side-effects in a clear and declarative fashion by using asynchronous data streams (reactive programming).
24. React Desktop
React UI Components for macOS High Sierra and Windows 10. This project is still very much looking for contributions
25. Reapop
A React & Redux notifications system
26. React Extras
Useful components and utilities for working with React
27. React Instant Search
Lightning-fast search for React and React Native applications, by Algolia.
React InstantSearch is a React library that lets you create an instant-search result experience using Algolia’s search API.
28. Uppy
Uppy is a sleek, modular JavaScript file uploader that integrates seamlessly with any application. It’s fast, easy to use and lets you worry about more important problems than building a file uploader.
29. React Motion
A spring that solves your animation problems. This library also provides an alternative, more powerful API for React’s TransitionGroup.
30. Hookstate
The simple but very powerful and incredibly fast state management for React that is based on hooks.
Hookstate is a modern alternative to Redux, Mobx, Formik without boilerplate. It is simple to learn but very flexible to use. It has got the impressive performance and predictable behavior.
Conclusion
In other to enhance the strength of Facebook’s Owned Javascript Library, React developers including its creators develop these components for different functions.
Check them out and share your thoughts with us in the comment section below.
