Data

Tools

Indexes

Applications

Experiments

Awesome

An open API service indexing awesome lists of open source software.

awesome-react-components

🚀 Curated Collection of Exceptional React Components & Libraries
https://github.com/saidee-hasan/awesome-react-components

Last synced: 8 days ago
JSON representation

Cloud Solutions

Databases

  • BCMS - API-based, open-source, self-hostable content management system for Gatsby, Nuxt and Next.
  • crisp-bigquery - Full stack Google BigQuery with Express in TypeScript.
  • react-server-routing-example - Universal client/server routing and data with AWS DynamoDB.

Code Design

Boilerplate

  • crisp-react - Express integration in TypeScript with support for multiple SPAs and pitfall avoidance.
  • cra-template-redux-auth-starter - A Redux auth starter boilerplate for CRA.
  • elegant - docs - demo - A simple React framework for rapidly building beautiful and expressive web applications with Next.js, Tailwind CSS, and Markdown loading.
  • extensive-react-boilerplate - Boilerplate with Next.js, Auth (Sign in, Sign up, Reset password, Confirm email, Refresh Token), Material UI, React Hook Form, I18N, File uploads (support local and Amazon S3 drivers), Tests, CI.
  • generator-starhackit - Full-stack starter kit.
  • nwb - CLI tool and devDependency for React apps & components and npm modules.
  • PBandJ - Zero-Config Reusable Component Framework.
  • react-hot-boilerplate - Minimal live-editing boilerplate for your next ReactJS project.
  • rockpack - Simple solution for creating React application with SSR, bundling, linting, testing within 5 minutes.
  • create-react-dependency - Create react dependencies with no build configuration.
  • phoenix - A simple boilerplate that helps you make your react application with Server Side Rendering & Localization support.
  • react-enterprise-starter-kit - Highly Scalable and Performant Awesome React Starter Kit for an enterprise application with a very easy maintainable codebase.
  • create-react-app - Create React apps with no build configuration.
  • electron-react-boilerplate - Live editing development on desktop app.

Communication with server

  • react-relay - Relay is a JavaScript framework for building data-driven React applications.
  • query - docs Powerful asynchronous state management, server-state utilities and data fetching for TS/JS, React, Solid, Svelte and Vue.
  • apollo-client - A simple caching client for any GraphQL server and UI framework.

CSS / Style

  • aphrodite - It's inline styles, but they work!.
  • reactponsive - Responsive components and hooks.
  • styled-components - Visual primitives for the component age.
  • stitches - CSS-in-JS with near-zero runtime, SSR, multi-variant support.
  • inline-style-prefixer - Run-time Autoprefixer for Inline Style Objects.
  • react-container-query - Modular responsive component.
  • react-responsive - Media queries in react for responsive design.
  • aesthetic - A powerful type-safe, framework agnostic, CSS-in-JS library for styling components, whether it be plain objects, importing stylesheets, or simply referencing external class names.

Data Store

  • baobab-react - React integration for Baobab.
  • cerebral - A state controller with its own debugger.
  • effector-react - React bindings for effector, an effective multi-store state manager.
  • fireproof - demo - docs Pure JS, zero dependency, CRDT database - runs in the browser and connects to any cloud or backend
  • RxDB - demo - docs A fast, local first, reactive Database for JavaScript Applications
  • fluxible - A pluggable container for universal flux applications.
  • react-i13n - A performant, scalable and pluggable approach to instrumenting your React application.
  • redux-batched-actions - Reducer + action to reduce actions under a single subscriber notification.
  • synergies - docs A performant and distributed context-state library for creating reusable React state logic by synergyzing atomar context pieces.
  • zustand - docs - A fast bearbones state-management solution using simplified flux principles and boilerplate-free hook api.
  • teaful - Tiny, easy and powerful React state management
  • reselect - Selector library for Redux.
  • kea - High level architecture for React apps.
  • resourcerer - Declarative data-fetching framework for REST APIs
  • react-redux - Official React bindings for Redux.
  • redux - Predictable state container for JavaScript apps.

Form Logic

  • data-driven-forms - A declarative way for building forms with all the functionality.
  • formik - Build forms without tears and supports Validation in ease.
  • Phormal - Docs & Demos - Responsive, multilingual forms with built-in validation, support for dark mode and right-to-left languages.
  • react-hook-form - React hooks for form validation without the hassle.
  • react-client-validation - Simple and super lightweight validation for React.
  • react-final-form - Subscription-based form state management
  • react-formawesome - Complex library for creating awesome forms.
  • surveyjs - The advanced Survey and Form library
  • Formily - High performance, extensible, and Typescript friendly
  • hook-form-react - docs - A lightweight, dependency-free solution React hooks for form validation.
  • formsy-react - A form input builder and validator for React JS.
  • react-jsonschema-form - A React component for building Web forms from JSONSchema.

HTML Template

Isomorphic Apps

  • hypernova - A service for server-side rendering your JavaScript views.
  • isomorphic-style-loader - Isomorphic CSS style loader for Webpack.
  • react-server - React framework with server render for blazing fast page load.
  • rill - Universal web application framework.
  • webpack-isomorphic-tools - Server-side rendering for your Webpack-built applications (e.g. React).

Miscellaneous

  • react-godfather - A new way to write Functional Components, without Hooks.
  • redux-auth-patch - Complete token authentication system for react + redux that supports isomorphic rendering.
  • tcomb-react - Alternative syntax for PropTypes.
  • react-universal-hooks - 🎉 support react hooks everywhere (Functional or Class Component).
  • redux-search - Redux bindings for client-side search.

Props from server

  • react-refetch - A simple, declarative, and composable way to fetch data for React components.
  • redux-connect - Provides decorator for resolving async props in react-router.
  • axios-react - HTTP client component for React.

Router

Dev Tools

Inspect

  • react-json-inspector - React JSON inspector component.
  • fluxguard - PROD change monitoring that highlights all DOM + design changes.
  • reactotron - A CLI and OS X app for inspecting your React JS and React Native apps.
  • react-inspector - Power of Browser DevTools inspectors right inside your React app.

Miscellaneous

Redux

Test

  • react-unit - Lightweight unit test library for ReactJS.
  • redux-test-recorder - A redux middleware to automatically generate tests for reducers through ui interaction.
  • rut - React testing made easy with react-test-renderer. Supports DOM and custom renderers.
  • unexpected-react - Plugin for unexpected to enable testing the full React virtual DOM, and also the shallow renderer.
  • playwright - to-end testing for modern web apps.
  • chai-enzyme - Chai.js assertions and convenience functions for testing React Components with enzyme.
  • jest-cli - Painless JavaScript Testing.
  • enzyme - JavaScript Testing utilities for React.

Miscellaneous

Miscellaneous

  • DataFormsJS JSX Loader - Small JavaScript Compiler for quickly converting JSX to JS directly on a web page.
  • html-to-react-components - Extract annotated portions of HTML into React components as separate modules.
  • htmltojsx - Automatically AJAXify plain HTML with the power of React. It's magic!.
  • jsonx - React JSON Syntax.
  • mozaik - Mozaïk is a tool based on nodejs / react / d3 / stylus to easily craft beautiful dashboards.
  • react-blessed - A react renderer for blessed.
  • jsondiffpatch-react - JSON diffing.
  • iron-session - Secure, stateless, and cookie-based session library.

Static Website Generator

  • gatsby - Transform plain text into dynamic blogs and websites using React.js.

Performance

App Size

Server-Side Rendering

  • iSSR - The easiest way to move your React application to Server-Side Rendering. Handles Side Effects and synchronizes State.
  • react-esi - A library to boost SSR performance by exposing React components as Edge Side Includes (ESI) fragments

UI

UI Animation

Form Components

Parallax

UI Components

Audio / Video

  • react-dailymotion - Dailymotion player component for React.
  • react-player - A react component for playing a variety of URLs, including YouTube.
  • video-react - A web video player built for the HTML5 world using React library.
  • material-ui-audio-player - Audio player for material ui design.
  • react-vision-camera - Camera component for React using getUserMedia. We can use this component for computer vision tasks like barcode scanning, text recognition, etc.
  • react-youtube - React.js powered YouTube player component.
  • react-barcode-qrcode-scanner - Barcode and QR code scanner component for React. It uses react-vision-camera to access the camera and Dynamsoft Barcode Reader to read barcodes.
  • react-soundplayer - Create custom SoundCloud players with React.

Buttons

Canvas

  • react-konva - React Konva is a JavaScript library for drawing complex canvas graphics with bindings to the Konva Framework.
  • react-sketch - A Sketch tool for React based applications, backed-up by FabricJS
  • react-sketch-canvas - Demo Freehand vector drawing tool for React using SVG as canvas. Accepts input from Mouse, touch, and graphic tablets
  • react-heat-map - A lightweight calendar heatmap react component built on SVG, customizable version of GitHub's contribution graph.

Captcha

Carousel

Chart

Collapse