Awesome React Save

A collection of awesome things regarding React ecosystem

Project README

Awesome React

A collection of awesome things regarding the React ecosystem.

React
React Native
Redux
GraphQL
Relay
Videos
Demo React Apps
Real React Apps
Contribution

React

JavaScript Library for building User Interfaces

React General Resources

React Community

React Online Playgrounds

Another Awesome Lists

React/Redux Links

React Tutorials

React General Tutorials

React Hooks

React and TypeScript

React Performance

React Internals

React Interview Questions

React Tools

React 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

React 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

React 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
refine - A React-based framework for building data-intensive applications in no time.

React 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

React Routing

react-location - Enterprise Client-Side Routing for React
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

React 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

React Awesome Components

Awesome React Components list
react-select - The Select Component for React
react-beautiful-dnd - Beautiful and accessible drag and drop for lists with React
react-dnd - Drag and Drop for React
react-grid-layout - A draggable and resizable grid layout with responsive breakpoints
react-table - A lightweight, fast and extendable datagrid for React
react-data-grid - Excel-like grid component built with React
react-draggable - React draggable component
react-resizable-and-movable - A resizable and draggable component for React
react-resizable - A simple React component that is resizable with a handle
react-resizable-box - A resizable component for React
react-searchbox-awesome - Minimalistic searchbox
react-sortable-pane - A sortable and resizable pane component for React
react-spaces - Nestable resizable, anchored, scrollable components
react-dates - An easily internationalizable, mobile-friendly datepicker library for the web
react-big-calendar - Calendar component
react-datepicker - ReactJS Datepicker
react-list - A versatile infinite scroll React component
react-intl - Internationalize React apps
react-i18next - Internationalization for React done right
react-aria-modal - A fully accessible React modal
react-hotkeys - Declarative hotkey and focus area management for React
react-keydown - Lightweight keydown wrapper for React components
react-joyride - Create guided tours for your apps
react-virtualized - React components for efficiently rendering large lists and tabular data
react-window - React components for efficiently rendering large lists and tabular data
data-source - Library to power streaming data visualisations as used in Facebook's Flipper
react-text-mask - Input mask for React
react-loading-skeleton - Create skeleton screens that automatically adapt to your app
react-spinkit - A collection of loading indicators animated with CSS for React
rheostat - Accessible slider component built with React
qrcode.react - QR component for use with React
react-archer - Draw arrows between React elements
react-pdf-viewer - A PDF viewer made for React
react-parallax-tilt - Easily apply tilt hover effect on React components
react-popper - Position tooltips and popovers in an elegant, performant manner
react-tsparticles - Easily create highly customizable particles animations
react-spring - Spring-physics based animation library for React applications
framer-motion - A React library to power production-ready animations
react-accessible-accordion - React Component for creating an 'Accordion' that adheres to the WAI ARIA spec for accessibility.
react-truncate-markup - React component for truncating JSX markup.
react-cookie - Universal cookies for React
react-slick - Carousel component built with React
react-gtm-module - Google Tag Manager Module for React
react-device-detect - Detect device for React
react-colorful - A tiny (2,5 KB), dependency-free, fast and accessible color picker component
react-modal - Accessible modal dialog component for React
cleave.js - Format input text content when you are typing
react-fontawesome - Font Awesome 5 React component
react-advanced-cropper - An advanced React component for image cropping
swiper - modern mobile touch slider

React Testing

jest - Delightful JavaScript Testing Framework
enzyme - JavaScript Testing utilities for React
react-testing-library - Simple and complete React DOM testing utilities
react-hooks-testing-library - React hooks testing utilities that encourage good testing practices
majestic - Zero config GUI for Jest

React 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.

React Integration

ReasonReact
React Rails
ReactJS.NET
om - ClojureScript interface
Reagent - A minimalistic ClojureScript interface to React.js
Express React views
React Page Middleware
ngReact - React Components in Angular
coffee-react-transform - Provides React JSX support for Coffeescript
sprockets-coffee-react - Sprockets preprocessor for CJSX
react-kup - A simple, non-intrusive alternative to jsx for coffeescript
turbo-react - Combine Turbolinks and React to apply DOM diffs
react-bacon - A little module for using React with Bacon.js
msx - React's JSX Transformer, tweaked to output calls to Mithril
react-backbone - Backbone-aware mixins for react
NestedReact - transparent integration with Backbone Views and NestedTypes models
backbone-reaction - React, Backbone and then some
react.backbone - Plugin for React to make Backbone migration easier
reactbone - React extensions for Backbone
backbone-react-ui - React components for use with backbone and backbone paginator
react-events - Declarative managed event bindings for react components
react-mixin-manager - React mixin registration manager
react-topcoat by @plaxdan - Topcoat CSS components built with the React library
react-topcoat by @arnemart - A collection of React components for Topcoat
reactdown - Write React components using markdown syntax
react-jade - Compile Jade to React JavaScript
jade-react - Compile Jade templates to React.DOM expressions
gulp-jade-react - Compile Jade templates into React de-sugared JSX with Gulp
sbt-reactjs - React SBT Plugin using npm
scalajs-react - A guilty affair between Scala.js and Facebook's React
react-xtags - Using React to implement xtags
jreact - React on server-side Java (with Rhino or Nashorn)
React.hiccup - A complete replacement for JSX written in sweet.js
react-play - Rendering React components in the Play Framework with JDK8's Nashorn
rx-react - Utilities to works with React in a RxJS
react-with-di - A hacked prototype of React.js with DI
reactfire - ReactJS mixin for easy Firebase integration
react-clickdrag-mixin - ClickDrag mixin for React component
react-masonry-mixin - Standalone mixin for Masonry (@desandro)
react-packery-mixin - Standalone mixin for Packery (Metafizzy)
react-dropzone - Simple HTML5 drag-drop zone with React.js.
aframe-react - A-Frame VR + React
react-three-fiber - A react reconciler for threejs (web and react-native)
react-three - React bindings to create and control a 3D scene using three.js
react-three-renderer - Render into a three.js canvas using React
react-threejs - Simplest bindings between React & Three.js
react-masonry-css - Fast Masonry layout powered by CSS, dependency free
react-captcha - A react.js reCAPTCHA for Google
reaptcha - Clean, modern and simple React wrapper for Google reCAPTCHA
react-recaptcha-that-works - A reCAPTCHA bridge for React that works

React 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
jotai - Bottom-up approach to React state management with an atomic model
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

React AR and VR

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

React Renderers

react-three-fiber - A React renderer for Three.js
react-pdf - Create PDF files using React
ink - React for interactive command-line apps
react-blessed - A React renderer for blessed terminal interface library
react-sketchapp - Render React components to Sketch
react-figma - A React renderer for Figma
react-nil - A react null renderer
remotion - Create videos programmatically in React

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
vest - Declarative form validation framework inspired by unit testing syntax.

Autocomplete

react-autocomplete by @rackt - WAI-ARIA compliant React autocomplete (Archived, read-only)
react-autosuggest by @moroshko - WAI-ARIA compliant React autosuggest component
react-autocomplete by @eliseumds - Just tasting some ReactJS + RxJS
react-autocomplete by @prometheusresearch - Autocomplete widget based on React
instatype by @gragland - Simple react autocomplete component
downshift - 🏎 Primitives to build simple, flexible, WAI-ARIA compliant enhanced input React components
React Bootstrap Typeahead - A React-based typeahead that relies on Bootstrap for styling and was originally inspired by Twitter's typeahead.js.

Graphics

react-art - React Bridge to the ART Drawing Library
react-canvas - High performance <canvas> rendering for React components
react-famous - Complex 3D animations UI at 60 FPS with Famo.us
react-kinetic - HTML5 Canvas via KineticJS using React
react-svg-morph - morph your svg components one into another
react-hooks-svgdrawing - SVG Drawing with React hooks
react-svg-pan-zoom - A React component that adds pan and zoom features to SVG.

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

React Native

Framework for building native apps using React

React Native General Resources

React Native Tutorials

React Native Development Tools

react-native-code-push - React Native module for CodePush

React Native Sample Apps

React Native Boilerplates

Create React Native App - Create React Native apps that run on iOS, Android, and web
Ignite - The hottest CLI for React Native, boilerplates, plugins, generators, and more!

React Native Awesome Components

Expo - The Expo platform for making cross-platform mobile apps
react-navigation - Routing and navigation for your React Native apps
react-native-social-share - Use the iOS and Android native Twitter and Facebook share popup with React Native
react-native-fbsdk - A wrapper around the iOS Facebook SDK
react-native-side-menu - Simple customizable component to create side menu
react-native-mapbox-gl - A Mapbox GL react native module
react-native-icons - Quick and easy icons in React Native
react-native-vector-icons - 3000 Customizable Icons for React Native with support for NavBar/TabBar
react-native-google-signin - Google Signin for React Native
react-native-picker-modal-view
react-native-gifted-chat - The most complete chat UI for React Native
react-native-fast-image - FastImage, performant React Native image component
recyclerlistview - High performance listview for React Native and web!
react-native-largelist - The best large list component for React Native
react-native-gesture-handler - Declarative API exposing platform native touch and gesture system to React Native
rn-placeholder - Display some placeholder stuff before rendering your text or media content in React Native

React Native Libraries

sentry-react-native - Real-time crash reporting for your web apps, mobile apps, and games.
realm-js - Realm is a mobile database: an alternative to SQLite & key-value stores
react-native-device-info - Device Information for React Native iOS and Android
react-native-react-bridge - A toolset to run React web app in React Native and handle communication between them.
uncompress-react-native - Simple library to decompress files .zip, .rar, .cbz, .cbr in React Native.

Redux

Predictable State Container for JavaScript Apps

Redux General Resources

Redux Tools

react-redux - Official React bindings for Redux
redux-toolkit - The official, opinionated, batteries-included toolset for efficient Redux development
redux-devtools - DevTools for Redux with hot reloading, action replay, and customizable UI
reselect - Selector library for Redux
redux-thunk - Thunk middleware for redux
redux-saga - An alternative side effect model for Redux apps
connected-react-router - A Redux binding for React Router
redux-form - A Higher Order Component using react-redux to keep form state
normalizr - Normalizes nested JSON according to a schema
redux-observable - RxJS middleware for Redux
redux-undo - Higher order reducer to add undo/redo functionality to redux state containers
redux-persist - Persist and rehydrate a redux store
Rematch - Redux made easy

Redux Tutorials

GraphQL

A query language for your API

GraphQL General Resources

GraphQL Tools

graphql-js - A reference implementation of GraphQL for JavaScript
express-graphql - Create a GraphQL HTTP server with Express
Apollo - Industry-standard GraphQL implementation
GraphQL Playground - GraphQL IDE for better development workflows

GraphQL Tutorials

GraphQL Implementations

graphql-ruby - Ruby implementation of GraphQL
graphql-java - GraphQL Java implementation
sangria - Scala GraphQL client and server library
graphql-php - A PHP port of GraphQL reference implementation
graphene - GraphQL framework for Python
graphql-dotnet - GraphQL for .NET
graphql-go - GraphQL for Go
juniper - GraphQL server library for Rust

Database Integration

Hasura - Instant GraphQL for all your data
Prisma - Next-generation ORM for Node.js and TypeScript
graphql-sequelize - GraphQL & Relay for MySQL & Postgres via Sequelize

Relay

Data-Driven React Applications

Relay General Resources

Relay Tutorials

Relay Tools

graphql-relay-js - A library to help construct a graphql-js server supporting react-relay
react-router-relay - Relay integration for React Router
relay-local-schema - Use Relay without a GraphQL server
relay-codemod - Codemod scripts based for on jsodeshift to update Relay APIs

Videos

Important Talks

ReactEurope Conf 2015 Day 1 Playlist

ReactEurope Conf 2015 Day 2 Playlist

ReactEurope Conf 2016 Day 1 Playlist

ReactEurope Conf 2016 Day 2 Playlist

React.js Amsterdam 2018 Playlist

Video Tutorials

Trying React Hooks for the first time with Dan Abramov

Demo React Apps

hackernews-react-graphql - Hacker News clone rewritten with universal JavaScript, using React and GraphQL
react-reduction - Free Admin Template Built with React and Bootstrap4
reactjs-tmdb-app - Responsive React The Movie Database App
react-shopping-cart - Simple ecommerce cart application built with React Redux

Real React Apps

kibana - Your window into the Elastic Stack
firefox debugger - The Firefox debugger that works anywhere
spectrum – Simple, powerful online communities
mattermost - Open source Slack alternative
overreacted - Personal blog by Dan Abramov
winamp2-js - Winamp 2 reimplemented for the browser

Contribution

This list started as personal collection of interesting things about React. At the time it started React was in beta, there was special script to transform JSX to JS and even Flux was not yet published. React is mainstream now, lots of things happened. Please, do not try to use this list as advertisement board or place for public push of your experiments. Only fully free resources here, please. Do not hesitate to suggest cleaning PRs for outdated projects and articles along with new contributions. Your contributions and suggestions are heartily♡ welcome, though. (✿◠‿◠)

Open Source Agenda is not affiliated with "Awesome React" Project. README Source: enaqx/awesome-react

Stars

54,281

Open Issues

160

Last Commit

3 months ago

Repository

enaqx/awesome-react

Open Source Agenda Badge

<a href="https://www.opensourceagenda.com/projects/awesome-react"><img src="https://www.opensourceagenda.com/projects/awesome-react/reviews/badge.svg" alt="Open Source Agenda"></a>

Submit Review Review Your Favorite Project

Submit Resource Articles, Courses, Videos

Submit Article Submit a post to our blog

From the blog

Dec 11, 2022

How to Choose Which Programming Language to Learn First?

From the blog

Dec 11, 2022