Skip to main content

React

JavaScript Library for building User Interfaces

General Resources​

Community​

Online Playgrounds​

Another Awesome Lists​

Tutorials​

General Tutorials​

Hooks​

and TypeScript​

Performance​

Internals​

Interview Questions​

Tools​

Development Tools​

  • react-devtools - Inspection of React component hierarchy in the Chrome and Firefox Developer Tools
  • react-hot-loader - Tweak React components in real time
  • react-loadable - A higher order component for loading components with promises
  • loadable-components - React code splitting made easy
  • reactotron - A desktop app for inspecting your React and React Native projects
  • storybook - UI component dev & test
  • docz - Zero Config, live-reloading documentation with Markdown + JSX
  • react-styleguidist - Isolated React component development environment with a living style guide
  • react-cosmos - Dev tool for creating reusable React components
  • eslint-plugin-react - React specific linting rules for ESLint
  • eslint-plugin-jsx-a11y - Static AST checker for a11y rules on JSX elements
  • @axe-core/react - Accessibility auditing for React applications
  • DataFormsJS JSX Loader - Small JavaScript Compiler for quickly converting JSX to JS directly on a web page
  • Why Did You Render - Monkey patches React to notify you about avoidable re-renders.
  • Divjoy - React codebase and UI generator to speed up development (paid)
  • Plasmic - Powerful design tool for building your React components visually.
  • jsx-ast-utils - AST utility module for statically analyzing JSX
  • react-scanner - Extract React components and props usage from code

Starter Kits and Toolchains​

  • create-react-app - Set up a modern Web app by running one command
  • Razzle - Build production ready React applications. Razzle is toolchain for modern static and dynamic websites and web applications
  • Neutrino React Preset - @neutrinojs/react is a Neutrino preset that supports building React web applications
  • react-starter-kit - Isomorphic Web app boilerplate
  • create-react-library - CLI for creating reusable, modern React libraries using Rollup and create-react-app.
  • tsdx - Zero-config CLI for TypeScript package development

Frameworks​

  • next.js - The React Framework
  • gatsby.js - Free and open source framework based on React
  • react-admin - Frontend Framework for building B2B applications on top of REST/GraphQL APIs
  • remix - Finally, a killer React framework from the creators of React Router
  • Blitz - The Fullstack React Framework
  • aleph.js - The React Framework in Deno

Styling​

  • styled-components - Visual primitives for the component age
  • emotion - Library designed for writing CSS styles with JavaScript
  • radium - A toolchain for React component styling
  • jss - Authoring tool for CSS
  • aphrodite - Framework-agnostic CSS-in-JS with support for server-side rendering, browser prefixing, and minimum CSS generation
  • linaria - Zero-Runtime CSS in JS
  • stitches - CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience
  • vanilla-extract - Zero-runtime Stylesheets-in-TypeScript

Routing​

  • react-router - Declarative routing for React
  • navi - Declarative, asynchronous routing for React
  • curi - JavaScript router for single-page applications
  • reach - Next Generation Routing for React
  • universal-router - A simple middleware-style router for isomorphic JavaScript web apps
  • wouter - A minimalist-friendly ~1.3KB routing library

Component Libraries​

  • material-ui - React components for faster and easier web development
  • blueprint - A React-based UI toolkit for the webs
  • Fluent UI - A set of React components for building Microsoft web experiences
  • react-bootstrap - Bootstrap components built with React
  • reactstrap - Simple React Bootstrap 4 components
  • ant-design - A design system with values of Nature and Determinacy
  • chakra-ui - Simple, Modular & Accessible UI Components for your React Applications
  • semantic-ui-react - The official Semantic-UI-React integration
  • evergreen - Evergreen React UI Framework by Segment
  • grommet - A react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package
  • rebass - React primitive UI components built with styled-system
  • reakit - Accessible, Composable and Customizable components for React
  • rsuite - A suite of React components
  • atlaskit - Atlassian's official UI library, built according to the Atlassian Design Guidelines.
  • baseweb - Base Web is a foundation for initiating, evolving, and unifying web products.
  • primereact - A complete UI Framework for React with 50+ components featuring material, bootstrap and custom themes.
  • eui - Elastic UI Framework
  • react-spectrum - Adobe's collection of libraries and tools that help you build adaptive, accessible, and robust user experiences
  • ring-ui - JetBrains Web UI components
  • react-bulma-components - React components for Bulma framework
  • react-bulma - React.js components for Modern CSS framework based on Flexbox
  • trunx - Super Saiyan React components, son of awesome Bulma, implemented in TypeScript
  • bumbag-ui - Build accessible & themeable React applications with your Bumbag
  • Mantine – A fully featured React library with 100+ hooks and components with native dark theme support
  • radix - An open-source UI component library for building high-quality, accessible design systems and web apps

Awesome Components​

Testing​

Libraries​

  • react-border-wrapper - A wrapper for placing elements along div borders in React.
  • react-magic - Automatically AJAXify plain HTML with the power of React
  • react-toolbox - A set of React components implementing Google's Material Design specification
  • tcomb-react - Library allowing you to check all the props of your React components
  • react-responsive - Media queries in react for responsive design
  • preact - Fast 3kb React alternative with the same ES6 API.
  • riotjs - A React-like, 3.5KB user interface library
  • Maple.js - Bringing the concept of web-components to React
  • react-i13n - A performant, scalable and pluggable approach to instrumenting your React application
  • react-icons - svg react icons of popular icon packs
  • react-open-doodles - Awesome free illustrations as react components.
  • Keo - Plain functions for a more functional Deku approach to creating React components, with functional goodies such as pipe, memoize, etc...
  • Bit - A virtual repository for managing and using react and other web components across applications
  • AtlasKit - Atlassian's React UI library
  • ReactiveSearch - UI components library for Elasticsearch
  • Slate - A completely customizable framework for building rich text editors.
  • react-json-schema - Construct React elements from JSON by mapping JSON definitions to React components that you expose.
  • react-lodash - Lodash as React components
  • react-helmet - A document head manager for React
  • react-snap - Zero-configuration framework-agnostic static prerendering for SPAs
  • Draft.js - A React framework for building text editors
  • refract - Harness the power of reactive programming to supercharge your components
  • react-desktop - OS X and Windows UI components built with React
  • reapop - A simple and customizable React notifications system
  • react-extras - Useful components and utilities for working with React
  • react-instantsearch - Lightning-fast search for React and React Native applications, by Algolia
  • uppy - The next open source file uploader for web browsers
  • react-motion - A spring that solves your animation problems
  • react-esi - React Edge Side Includes
  • react-aria - Adobe's library of React Hooks that provides accessible UI primitives for your design system
  • react-uploady - Modern file-upload components & hooks for React.

Integration​

State Management​

  • redux - Predictable State Container for JavaScript Apps
  • mobx - Simple, scalable state management
  • react-query - Hooks for fetching, caching and updating asynchronous data in React
  • flux - Application architecture for building user interfaces
  • recoil - Experimental state management library for React apps
  • xstate-react - State machines and statecharts for the modern web
  • zustand - Bear necessities for state management in React
  • easy-peasy - Vegetarian friendly state for React
  • hookstate - The simple but very powerful and incredibly fast state management for React that is based on hooks
  • effector - Fast and powerful reactive state manager
  • reactn - React, but with built-in global state management
  • react-facet - Observable-based state management for performant game UIs built in React

AR and VR​

  • Viro React - Platform for rapidly building AR/VR applications using React Native

Renderers​

Forms​

  • formik - Build forms in React, without the tears
  • react-hook-form - React Hooks for forms validation
  • react-jsonschema-form - A React component for building Web forms from JSON Schema
  • react-final-form - High performance subscription-based form state management for React
  • unform - Performance-focused API for React forms
  • formily - Alibaba Group Unified Form Solution
  • uniforms - A React library for building forms from any schema
  • formsy-react - A form input builder and validator for React
  • react-formal - Sophisticated HTML form management for React

Autocomplete​

Graphics​

Data Managing​

  • immer - Create the next immutable state by mutating the current one
  • ReSub - A library for writing better React components and data stores
  • immutable-js - Immutable Data Collections for Javascript
  • baobab - JavaScript & TypeScript persistent and optionally immutable data tree with cursors
  • WatermelonDB - 🍉 Reactive & asynchronous database for powerful React and React Native apps ⚡️
  • RxDB - A realtime Database for JavaScript Applications

Maps​

  • react-googlemaps - React interface to Google maps
  • react-maps - A map component for React
  • react-google-maps - React.js Google Maps integration component
  • react-gmaps - A Google Maps component for React.js
  • react-map-gl - A React wrapper for MapboxGL-js plus overlay API
  • google-map-react - Isomorphic google map React component
  • react-mapbox-gl - A mapbox-gl-js wrapper to make the API react friendly
  • google-maps-react - A declarative Google Map React component using React, lazy-loading dependencies, current-location finder and a test-driven approach by the Fullstack React team.
  • react-leaflet - React components for Leaflet maps
  • react-geo - A set of geo-related components using react, antd, and ol
  • pigeon-maps - ReactJS maps without external dependencies

Charts​

  • vx - Visualization components
  • victory - A collection of composable React components for building interactive data visualizations
  • react-vis - Data Visualization Components
  • recharts - Redefined chart library built with React and D3
  • nivo - Provides a rich set of data visualization components, built on top of the D3 and React libraries
  • echarts-for-react - Apache ECharts components for React wrapper
  • react-apexcharts - React Component for ApexCharts
  • chartify - React plugin for building charts using CSS