Skip to content

Sensiblemnd/awesome-react

BranchesTags
 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1,884 Commits

.travis.yml

.travis.yml

 
 

README.md

README.md

 
 

Repository files navigation

Awesome React Awesome

A collection of awesome things regarding the React ecosystem.

React

JavaScript Library for building User Interfaces

React General Resources

React Community

React Online Playgrounds

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
  • codesandbox - An online IDE for rapid React development with integrated React DevTools.
  • 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.
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
  • aleph.js - The React Framework in Deno
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
React 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
React Component Libraries
  • material-ui - React components for faster and easier web development
  • ant-design - A design system with values of Nature and Determinacy
  • 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
  • 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
  • chakra-ui - Simple, Modular & Accessible UI Components for your React Applications
  • rebass - React primitive UI components built with styled-system
  • react-fontawesome - Font Awesome 5 component library for React
  • 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.
  • react-bulma-components - React components for Bulma framework
  • react-bulma - React.js components for Modern CSS framework based on Flexbox
  • rbx - The Comprehensive Bulma UI Framework for React
  • trunx - Super Saiyan React components, son of awesome Bulma, implemented in TypeScript
  • tailwind-react-ui - React utility component primitives & UI framework for use with Tailwind CSS
  • tails-ui - Clean UI based on tailwindcss
  • geist-org/react - Modern and minimalist React UI library, originating from Vercel's design
  • elastic ui framework - The Elastic UI Framework is a collection of React UI components for quickly building user interfaces at Elastic.
  • bugbag react ui kit - Bumbag is a friendly React UI Kit suitable for MVPs or large-scale applications.
  • ring-ui - JetBrains Web UI components
  • ChatUI - The UI design language and React library for Conversational UI
  • react-spectrum - Adobe's collection of libraries and tools that help you build adaptive, accessible, and robust user experiences
React Awesome Components
React for Command Line
  • ink - React for interactive command-line apps
  • react-blessed - A React renderer for blessed terminal interface library
React Testing
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
  • react-cursor - Functional state management abstraction for use with Facebook React
  • Touchstonejs - React.js powered UI framework for developing beautiful hybrid mobile apps.
  • Elemental - A UI Toolkit for React.js Websites and Apps
  • StateTrooper - Centrally manage state for React applications with CSP
  • 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.
  • compose-state - Compose multiple setState or getDerivedStateFromProps updaters in React
  • react-lodash - Lodash as React components
  • react-helmet - A document head manager for React
  • ClearX - Fast & Effortless State management for React with zero learning curve. ClearX gives great flexibility in separation of concerns for your React applications
  • 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 React & Redux 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
  • hookstate - Modern, very fast and extendable state management for React that is based on hooks
  • universal-model-react - Unified state management solution for React
  • 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
React State Management
React AR and VR
  • React 360 - Create exciting 360 and VR experiences using React (Archived, read-only)
  • Viro React - Platform for rapidly building AR/VR applications using React Native
React Renderers
Forms
  • React Forms
  • react-formal - Better form validation and value management for React, Provides minimal wiring
  • react-forms - Forms library for React
  • valuelink - Full-featured two-way data binding with extended React links
  • wingspan-forms - A dynamic form library for Facebook React
  • newforms - Isomorphic form-handling for React
  • formjs - A form generator for Reactjs
  • react-form-builder - A Form Builder for React.js
  • plexus-form - A dynamic form component for react using JSON-Schema
  • tcomb-form - UI library for developing forms writing less code
  • formsy-react - A form input builder and validator for React JS
  • Learn Raw React - Ridiculously Simple Forms
  • Winterfell - Generate complex, validated and extendable JSON-based forms in React
  • Redux-Autoform - Create Redux-Forms dynamically out of metadata
  • uniforms - Bunch of React components and helpers to easily generate and validate forms
  • formik - Forms in React, without tears
  • NeoForm - Modular HOCs for form state management and validation
  • react-jsonschema-form - A React component for building Web forms from JSON Schema
  • List View Select - A Toggleable select box for React Native with native components
  • Final Form 🏁 -
  • formland - A simple, super-flexible, extensible config based form generator
  • react-reactive-form - Angular like reactive forms in React
  • unform - ReactJS form library to create uncontrolled form structures with nested fields, validations and much more!
  • react-hook-form - Performant, flexible and extensible forms with easy to use validation
Autocomplete
Graphics
Data Managing
  • Immutable.js - Immutable Data Collections for Javascript
  • cortex - A javascript library for centrally managing data with React
  • avers - A modern client-side model abstraction library
  • imvvm - Immutable Model-View-ViewModel for React
  • morearty.js - Better state management for React in pure JavaScript
  • valuable - An immutable data store for React
  • react-resolver - Isomorphic library to recursively lazy-load data for React components
  • freezer-js - Lightweight and reactive immutable data structure for React
  • MobX - Simple, scalable state management
  • baobab - JavaScript persistent and optionally immutable data tree with cursors
  • baobab-react - React integration for Baobab
  • immstruct - Immutable data structures with history for top-to-bottom properties in component based libraries like React
  • seamless-immutable - Immutable data structures for JavaScript which are backwards-compatible with normal JS Arrays and Objects
  • tydel - Typed Models and Collections, with React bindings
  • extendable-immutable - Extend any Immutable.js data structure
  • statty - A tiny and unobtrusive state management library for React and Preact apps
  • Hydux - An Elm-Like state manager for React with "batteries included"
  • ReSub - A library for writing better React components and data stores
  • ProppyJS - A tiny library for functional props composition
  • WatermelonDB - 🍉 Next-gen database for powerful React and React Native apps that scales to 10,000s of records and remains fast
  • RxDB - A realtime Database for JavaScript Applications
  • Effector - Fast and powerful reactive state manager. Lets you write simple, fast and type safe code and manage reactive state with ease.
  • reactn - React, but with built-in global state management
  • immer - Create the next immutable state by mutating the current one
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
  • DevExtreme React Chart - High-performance plugin-based React chart for Bootstrap and Material Design
  • react-chartjs - Common react charting components using chart.js
  • react-stockcharts - Highly customizable stock charts with ReactJS and d3
  • Number Picture - Low-level building blocks for constructing animated visualizations with React & D3.
  • Victory - A collection of composable React components for building interactive data visualizations
  • Recharts - A charting library built on D3 with an awesome declarative API
  • React-ApexCharts - React component for ApexCharts (An Interactive SVG Chart Library)
  • reaviz - React Data Visualization Library based on D3.js
  • react-vis - A React visualization library designed with the following principles in mind: React-friendly, high-level and customizable, expressive, and industry-strong.
  • nivo - It provides a rich set of data visualization components, built on top of the D3 and React libraries.
  • vx - A collection of reusable low-level visualization components. It combines the power of D3 to generate your visualization with the benefits of React for updating the DOM.
  • echarts-for-react - A very simple ECharts wrapper for React.
  • Chartify - React plugin for building charts using CSS.
  • Semiotic - A data visualization framework combining React and D3.
  • react-muze - React wrapper for muze (free data visualization library for creating exploratory data visualizations in browser, using WebAssembly)
  • reaflow - Diagram editor for React

React Native

Framework for building native apps using React

React Native General Resources

React Native Tutorials

React Native Development Tools

React Native Sample Apps

React Native Boilerplates

  • Create React Native App - Create a React Native app on any OS with no build config, with or without Expo
  • Snowflake - React Native iOS & Android with Redux, Parse.com, Jest (88% coverage)
  • Ignite - The hottest CLI for React Native, boilerplates, plugins, generators, and more!
  • React Native Starter Kit - A powerful starter project that bootstraps development of your mobile application

React Native Awesome Components

React Native Libraries

Redux

Predictable State Container for JavaScript Apps

Redux General Resources

Redux Tools

  • react-redux - Official React bindings for Redux
  • redux-devtools - DevTools for Redux with hot reloading, action replay, and customizable UI
  • react-router-redux - Bindings to keep react-router and redux in sync
  • redux-toolkit - The official, opinionated, batteries-included toolset for efficient Redux development
  • redux-form - A Higher Order Component using react-redux to keep form state
  • redux-thunk - Thunk middleware for redux
  • redux-logger - Logger middleware for redux
  • reselect - Selector library for Redux
  • normalizr - Normalizes nested JSON according to a schema
  • redux-saga - An alternative side effect model for Redux apps
  • redux-data-fx - Declarative Side Effects for Redux
  • redux-observable - RxJS middleware for Redux
  • redux-analytics - Analytics middleware for Redux
  • redux-undo - Higher order reducer to add undo/redo functionality to redux state containers
  • redux-search - Redux bindings for client-side search
  • redux-mock-store - A mock store for your testing your redux async action creators and middleware
  • redux-immutable - Create an equivalent function of Redux combineReducers that works with Immutable.js state
  • redux-react-i18n - An i18n solution for redux/react
  • R16N - A redux/react I18n solution
  • redux-actiontyper - Helper to create less verbose action types for Redux
  • redux-state-validator - A simple redux middleware to validate redux state values and object types using JSON Schema
  • redux-persist - Persist and rehydrate a redux store

Redux Tutorials

MobX

Simple, scalable state management for JavaScript Apps

MobX General Resources

MobX Tools

  • mobx-react - React component wrapper for combining React with MobX

MobX Tutorials

GraphQL

Query Language

GraphQL Spec

GraphQL Tools

GraphQL Tutorials

GraphQL Implementations

Server Integration

Database Integration

  • Hasura - Instant Realtime GraphQL on Postgres
  • Prisma - A performant open-source GraphQL ORM-like * layer doing the heavy lifting in your GraphQL server.
  • graphql-bookshelf - Some help defining GraphQL schema around BookshelfJS models
  • GraphpostgresQL - GraphQL for PostgreSQL
  • graffiti - Node.js GraphQL ORM
  • sql-to-graphql - Generate a GraphQL API based on your SQL database structure
  • graphql-sequelize - GraphQL & Relay for MySQL & Postgres via Sequelize

Relay

Data-Driven React Applications

Relay General Resources

Relay Tutorials

Relay Tools

Apollo

Data stack based on GraphQL

Apollo General Resources

Apollo Tools

Videos

reactjsvideos.com

Important Talks

React.js Conf 2015 Playlist

ReactEurope Conf 2015 Day 1 Playlist

ReactEurope Conf 2015 Day 2 Playlist

ReactRally Conf 2015 Playlist

React.js Conf 2016 Playlist

React Amsterdam 2016 Playlist

ReactEurope Conf 2016 Day 1 Playlist

ReactEurope Conf 2016 Day 2 Playlist

ReactRally Conf 2016 Playlist

React.js Amsterdam 2018 Playlist

Video Tutorials

Demo React Apps

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
  • dnote - A command line notebook with multi-device sync and web interface

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. Your contributions and suggestions are heartily♡ welcome, though. (✿◠‿◠)

CC0

About

A collection of awesome things regarding React ecosystem

Resources

Readme
Activity

Stars

0 stars

Watchers

1 watching

Forks

0 forks
Report repository

Releases

No releases published

Packages

No packages published