React Components

Source: https://github.com/brillout/awesome-react-components at 66b2758c4808
License: CC0-1.0
Read the English original

This edition is an AI-assisted translation.

🚀 Absolutamente impresionante React Componentes ” Bibliotecas

Esta es una lista de componentes AWESOME. No, no es una lista completa de todos. React componente bajo el sol. Entonces, ¿qué significa “awesome”? Bueno:

• Resolve un problema real
• Lo hace de una manera única, hermosa o excepcional. (Y no es súper popular y bien conocido… no tiene sentido enumerarlos).
• Es reciente. code ¡Se compromete!

Busque un 🚀 para proyectos realmente increíbles. Y busque comentarios y opiniones de los usuarios en (países típicos) después de algunos listados de nota.

Véase también: Awesome React Frameworks.

Maintainers:

• @petebray, author of Fluxguard — monitor PROD website changes.
• @brillout, author of Vike — a fast Vite-based React framework that is flexible, lean, community-driven and dependable.

Contribución

Por favor, revise nuestro Directrices de contribución. Mantenemos esta lista fresca por ** requiriendo todas las relaciones públicas para eliminar una o más entradas no impresionantes de esta lista**. Por favor, SOLAMENTE PRÁCTICA un nuevo recurso si usted también está eliminando uno.

Cuadro de contenidos

• UI Componentes
  • Rejilla de datos editable / hoja de cálculo
  • Cuadro
  • Infinito Scroll
  • Superposición
  • Notificación
  • Herramienta
  • Menú
  • Sticky
  • Tabs
  • Loader
  • Captcha
  • Carousel
  • Botones
  • Collapse
  • Chart
  • Paleta de mando
  • Árbol
  • UI Navegación
  • Scrollbar personalizado
  • Audio / Video
  • Mapa
  • Tiempo / Fecha / Edad
  • Foto / Imagen
  • Iconos
  • Paginador
  • Markdown Viewer
  • Canvas
  • Captura
  • Varios
  • Componentes de formulario
    • Fecha Time picker
    • Emoji picker
    • Tipos de entrada
    • Autocompleto
    • Seleccione
    • Color Picker
    • Toggle
    • Slider
    • Radio Button
    • Seleccione
    • Tag Input
    • Automatizar la entrada / Textarea
    • Star Rating
    • Arrastre y suelte
    • Lista clasificable
    • Rich Text Editor
    • Markdown Editor
    • Edición de imagen
    • Colecciones de componentes de formulario
    • Varios
    • Sintaxis Highlight
• UI A ti
• UI Animación
  • Parallax
• UI Marcos
  • Responsabilidad
    • Material Design
  • Móvil
  • Colecciones de componentes
• UI Utilidades
  • Reporter
    • Visibility Reporter
    • Informe de medición
  • Entrada de dispositivos
    • Eventos de teclado
    • Scroll Events
    • Touch Swipe
    • Mouse Eventos
  • Meta Etiquetas
  • Portal
  • Test User Behavior
• Code Design
  • Data Store
  • Formulario Logic
  • Router
  • Props del servidor
  • Comunicación con servidor
  • CSS / Estilo
  • HTML Plantilla
  • Aplicaciones Isomorfos
  • Boilerplate
  • Varios
• Utilidades
  • i18n
  • Marcos de unión / integraciones
  • Integración con servicios de terceros
• Ejecución
  • UI
    • Inspección
    • Lazy Load
  • App Size
  • Server-Side Rendering
• Herramientas de Dev
  • Prueba
  • Redux
  • Inspección
  • Varios
• Varios
  • Static Website Generator
• Cloud Solutions
  • Base de datos

UI Componentes

Back to top ⬆️

Rejilla de datos editable / hoja de cálculo

• AG Grid - Rejilla de datos avanzada / soporte de tabla de datos Javascript / React / AngularJS / Componentes Web.
• fortune-sheet - Un componente de hoja de cálculo en línea que proporciona características fuera de la caja como Excel.
• gigatables-react - Clasificación, paginación / pergamino infinito, búsqueda global/column, AJAX CRUD, y más.
• Handsontable - demo - docs - Rejilla de datos con hoja de cálculo UI apoyo React, Angular, TypeScript y JavaScript.
• jqwidgets-react-grid - Filtro, Pagination, Grouping, Exportar a Excel, PDF, CRUD y más.
• MUI X Data grid - demo/docs - Cuadrícula de datos rápida y personalizable con características avanzadas para usuarios de energía y casos de uso complejo.
• react-data-grid - Como la rejilla de Excel.
• ReactGrid - demo/docs - Agregue el comportamiento de hoja de cálculo a su aplicación
• revo-grid - demo/docs - Powerfull Data Grid for React / AngularJS / Vue / Componentes Web con personalización avanzada.
• SheetXL – A high-performance spreadsheet grid. TypeScript, ESM, Node/browser, Excel-compatible functions.
• SVAR React DataGrid - demo - docs - React DataGrid con edición en celda, datos de árboles, menú contextual, desplazamiento virtual, etc.

Cuadro

• ka-table - demo - Componente de mesa personalizable con clasificación, filtrado, agrupación, virtualización, edición, etc.

• mantine-datatable - demo/docs - Componente de mesa ligera para Mantine UI aplicaciones, con muchas características

• material-table - demo/docs - Construido Material UI, más: agrupación, datos de árboles, filas expandibles, exportación, edición en línea

• mui-datatables - Construido Material UI. Buscar, estilizar, filtrar, redimensionar / ocultar columnas, exportar, imprimir, seleccionar/expandir filas.

• react-data-table - demo/docs - mesa configurable, accesible, receptivo, accesible configurable, con clasificación, filas seleccionables, filas ampliables, paginación

• TanStack Table - demo - Sin cabeza UI para la construcción de tablas de gran alcance

• react-table-library - demo - React Biblioteca de mesa - una biblioteca de mesa casi sin cabeza - para construir mejores tablas.

• rsuite-table - demo/docs - Un componente de mesa que permite virtualizar.

• DevExtreme React Grid - Red de datos basada en plugins de alto rendimiento para Bootstrap y Material Design.

• Smart React Grid - Cuadrícula de datos rápida y completa con funciones Material Design.

• simple-table - demo - docs - Ligero, rápido y rico. Clasificación/filtración, virtualización, datos de árboles, cabeceras anidadas, columnas pintadas, estilo personalizado, etc.

• KendoReact Grid - Componente de red de datos potente con 100+ características listas para usar como paging, clasificación, exportación a Excel, y más.

• Material-React-Table - Una presentación completa Material UI V5 implementación de TanStack React Cuadro V8, escrito desde el suelo en TypeScript

Infinito Scroll

• @egjs/react-infinitegrid - npm - demo - Un módulo utilizado para organizar elementos de tarjeta incluyendo el contenido infinitamente de acuerdo con varios tipos de diseño.
• react-lazyload - Desactiva tu componente, imagen o cualquier otra cosa donde importe el rendimiento.
• react-list - Un desplazamiento infinito versátil React componente.
• @af-utils/virtual - demo/docs - Render grandes listas de desplazamiento y rejillas.
• react-window - demo - React componentes para renderizar eficientemente listas grandes y datos tabulares
• virtua - demo - Un componente de lista virtual de cero-config, rápido y pequeño (~3kB) React, Vue y Solid.

Superposición

Display overlay / modal / alert / diálogo / lightbox / popup

• react-aria-modal - Un acceso pleno y flexible React modal built according WAI-ARIA Autorización de prácticas.
• react-modal - Componente de diálogo modal accesible para React.
• @paratco/async-modal - Simple async modal handler para React.
• reoverlay - demo - La solución faltante para gestionar modals.
• sweetalert2 - demo/docs - Una hermosa, sensible, altamente personalizable y accesible (WAI-ARIA) reemplazo para JavaScriptEs cajas de popup. Cero dependencias.
• sweetalert2-react-content - potenciador oficial SweetAlert2 añadiendo soporte para React elementos como contenido

Notificación

Toaster / snackbar — Notificar al usuario con una pequeña popup temporal de la maqueta

• react-notifications-component - demo - Componente altamente personalizable y fácil de usar para notificaciones.
• notistack - demo - docs - Barritas de notificación altamente personalizables (toasts) que se pueden apilar entre sí
• react-local-toast - demo - docs - mostrar retroalimentación vinculada a un componente particular en lugar de brindis a nivel de toda la aplicación.
• react-toast - demo - docs - Notificaciones mínimas de tostadas.
• 🚀 react-toastify - demo - la mejor apuesta por el momento. El apoyo de los ganchos. No hay refs.
• react-confirm-lite - demo - es un diálogo de confirmación ligero y basado en promesas React con incorporado Tailwind CSS apoyo. Está diseñado para ser tan simple de usar como react- astificar, mientras se mantiene completamente personalizable.
• reapop - A React & Redux Sistema de notificaciones.
• react-hot-toast - demo - Notificaciones calientes para fumar ReactLigero, personalizable y hermoso por defecto.
• Sonner - Un componente tostado opinado para React.

Herramienta

• react-tooltip - React Componente de punta de herramienta.

Menú

Menus / sidebars

• hamburger-react - demo/docs - Iconos de menú de hamburguesas animadas React.
• react-burger-menu - Una barra lateral off-canvas con efectos y estilos.
• react-offcanvas - Menús Off-canvas para React.
• react-planet - demo - Crear menús circulares que parezcan planetas.
• mantine-contextmenu - demo/docs - Context-menu gancho/componente para aplicaciones construidas con Mantine UI.

Sticky

cabeceras fijas / cabeceras de desplazamiento / elementos pegajosos

• react-headroom - Escóndete la cabecera hasta que lo necesites.
• react-stickynode - A performant and comprehensive React pegajoso.

Tabs

• react-tabs - React componente de pestañas.
• react-tabtab - React, pestañas.

Loader

Loaders / spinners / barras de progreso — Haga que el usuario sepa que algo está cargando

• react-loader-spinner - Colección de conjunto react-Spinner para operación asinc.
• react-redux-loading-bar - Bar de carga simple para Redux y React.
• react-spinners-css - Colección asombrosa react componentes de spinners.
• react-spinners - Una colección de componentes de spinner de carga para react.
• react-content-loader - Componente accionado por SVG para crear cargas de marcadores de posición (como carga de tarjetas de Facebook).

Captcha

• react-simple-captcha - npm - demo - React Simple Captcha es un captcha muy potente, altamente personalizable y fácil de usar para React JS.
• procaptcha - demo - docs - Política de privacidad libre CAPTCHA

Carousel

• @egjs/react-flicking - npm - demo - Es carrusel confiable, flexible y extensible.
• react-awesome-slider - demo - Fullpage, 3D animado, 60fps media y contenido slider/carousel.
• pure-react-carousel - Construido desde cero y no muy opinado.
• react-id-swiper - Una biblioteca para usar idangerous Swiper como un ReactJs componente
• react-instagram-zoom-slider - demo - Un componente deslizante con pinche para ampliar las capacidades inspiradas en Instagram.
• react-responsive-carousel - React.js Carrusel responsable (con Swipe).
• react-slick - React componente carrusel.
• keen-slider - demo - Carrusel / deslizante con native comportamiento táctil/es.
• swiper - demo - docs - El slider móvil más moderno con transiciones aceleradas de hardware y increíbles native comportamiento.

Botones

• react-awesome-button - demo - Botones animados 3D 60fps con progreso de carga y acciones de acciones sociales.
• reactive-button - demo - docs - Un hermoso componente de botón animado con indicador de progreso.

Collapse

• react-accessible-accordion - Componente de Acuerdo Accesible React.
• react-collapse - Componente destripador para la animación del colapso con react- emoción.
• react-tabbordion - demo - Universal, semántico y CSS- solo componentes para crear Acordios y Tabs.

Chart

Display datos en gráficos / gráficos / diagramas

• essential js 2 charts - Gráficos y gráficos hermosos e interactivos para react.
• EazyChart - demo - docs - Transformar fácilmente los datos en gráficos significativos
• echarts for react - Wrapper alrededor hermoso Apache Echarts
• jscharting-react – React chart component offering a complete set of chart types and engaging data visualizations with JSCharting.
• react-chartist - React componente para Chartist.js.
• react-charty - demo - Datos interactivos pequeños pero potentes con múltiples tipos de gráficos, animaciones, zoom, temática.
• react-chartjs-2 - Común react componentes de trama usando Chart.js 2.0.
• react-d3-components - D3 Componentes para React.
• react-google-charts - React-google-charts React componente.
• react-highcharts - React- Highcharts.
• react-sparklines - Hermosas y expresivas Sparklines React componente.
• react-timeseries-charts - Horarios declarativos gráficos.
• react-vis - Biblioteca de visualización de datos basado en React y d3.
• recharts - Biblioteca gráfica redefinida construida con React y D3.
• rumble-charts - React componentes para construir gráficos composibles y flexibles.
• victory - Data viz for React.
• semiotic - Semiotic es un marco de visualización de datos React.
• SVAR React Gantt - demo - docs - Componente gráfico Gantt interactivo y personalizable
• DevExtreme React Chart - Gráfico basado en plugins de alto rendimiento para Bootstrap y Material Design.
• Smart React Chart - Característica completa Biblioteca Charting.
• react-muze - React envoltura para muze(libre biblioteca de visualización de datos para crear visualizaciones de datos exploratorios en el navegador, utilizando WebAssembly)
• Flowchart React - Flowchart & Flowchart diseñador para React.js.
• react-dashboard - Isomorphic Dashboards.

Paleta de mando

• cmdk - Menú de comando rápido, composable, sin estilo React.
• kbar - demo - Interfaz rápida, portátil y extensible cmd+k.

Árbol

Display a tree data structure

• json-edit-react - demo - Altamente configurable JSON/Object Tree viewer y editor
• react-arborist - demo - Una vista completa del árbol: sin cabeza, virtualizado, multi-seleccionable, arrastrar-n-drop, navegación del teclado, búsqueda
• react-complex-tree - demo - docs - Unpinionated Accessible Tree Component with Multi-Select, Drag-And-Drop and Search
• he-tree-react - demo - docs - Árbol, personalizable UI, datos planos, datos de árboles, drag-n-drop, marcador de posición para gota, plegable, casilla de verificación, virtualizado.

UI Navegación

Fue para navegar puntos de vista

• react-scroll - React componente de desplazamiento.
• react-swipeable-views - A React Componente para pestañas enlazadas y vistas deslizables.

Scrollbar personalizado

• rc-scrollbars - demo - Barras de desplazamiento personalizables con opciones flex y 60FPS
• react-custom-scroll - demo - Personalizar fácilmente la barra de desplazamiento del navegador con native OS comportamiento de desplazamiento.
• react-shadow-scroll - Componente que personaliza la imagen e inserta sombra cuando el desplazamiento existe.

Audio / Video

• react-dailymotion - Componente de reproductor de Dailymotion React.
• react-player - A react componente para reproducir una variedad de URLs, incluyendo YouTube.
• react-soundplayer - Crear jugadores personalizados de SoundCloud con React.
• react-youtube - React.js componente de reproductor de YouTube alimentado.
• video-react - Un reproductor de vídeo web construido para el mundo HTML5 React biblioteca.
• material-ui-audio-player - Reproductor de audio para material ui design.
• react-vision-camera - Componente de cámara para React usando getUserMedia. Podemos utilizar este componente para tareas de visión informática como escaneado de códigos de barras, reconocimiento de texto, etc.
• react-barcode-qrcode-scanner - Código de barras y QR code Componente de escáner para React. Utiliza react-vision-camera para acceder a la cámara y Dynamsoft Barcode Reader para leer códigos de barras.

Mapa

• google-map-react - Mapa de google universal react componente, permite renderizar react componentes en el mapa de Google.
• mapkit - Una biblioteca para integrar Mapas de Apple usando MapKit JS, con anotaciones, superposiciones y búsqueda.
• pigeon-maps - demo - ReactJS Mapas sin dependencias externas.
• react-geosuggest - A React autosuggest para Google Maps Places API.
• react-leaflet - React componentes para mapas de Leaflet.
• react-map-gl - A React envoltorio para MapboxGL-js y API de superposición.
• react-svg-map - demo - Un conjunto de componentes para mostrar un mapa interactivo SVG.

Tiempo / Fecha / Edad

Tiempo de reproducción / fecha / edad

• react-timeago - Un simple componente de tiempo-ago para ReactJs.
• timeago-react - Fecha de formato con *** time ago declaración. “Hace 3 horas”.
• react-google-flight-datepicker - Google fecha de vuelo picker implementado en ReactJS.

Foto / Imagen

Display imágenes / fotos

• lightGallery - demo - docs - Componente completo de la galería de luz.
• react-compare-image - demo - React componente para comparar dos imágenes usando un slider.
• react-image-gallery - Galería de imágenes responsable, carrusel, slider de imagen react componente.
• yet-another-react-lightbox - demo - docs - React componente de caja de luz.
• react-intense - A React componente para ver imágenes grandes de cerca.
• react-photo-album - demo - docs -Responsivo React Galería de fotos.
• react-svg-pan-zoom - A React componente que añade características de pan y zoom a SVG.
• react-particle-image - demo - Render imágenes como partículas interactivas.
• react-imgix - ¡Añada imágenes rápidas y receptivas como imagen, imagen o fondo!
• @frameright/react-image-display-control - Definir regiones de zoom para imágenes inteligentes.
• zoom-image - demo - docs - Una biblioteca agnóstica marco poco potente para ampliar la imagen en la web
• react-infinite-gallery – Infinite-scroll image gallery component for React apps.

Iconos

Display iconos / conjunto de iconos / emojis

• iconify-react - Más de 40k iconos de 50+ conjuntos de iconos, incluyendo todos los juegos populares de iconos y emoji.
• react-icons - Svg react iconos de paquetes de iconos populares utilizando importaciones ES6.
• react-open-doodles - Impresionantes ilustraciones gratis como react componentes.
• react-icomoon - Con react-icomoon puede utilizar fácilmente los iconos que ha seleccionado o creado en icomoon.
• tabler-icons-react - Un juego de más de 450 iconos SVG de alta calidad con licencia MIT gratis.
• Lucide - Hermoso y consistente kit de herramientas de icono hecho por la comunidad. Proyecto de código abierto y tenedor de Feather Icons.

Paginador

Display a control element to paginate

• react-paginate - A ReactJS componente que crea una paginación.
• react-laravel-paginex - Pagination de Laravel con ReactJS (costumbrable).
• paginated - React render props & gancho personalizado para construir paginación.
• react-steps - Demo -Responsivo React Stepper.

Markdown Viewer

Display pared markdow source

• react-markdown - Render Markdown como React componentes.

Canvas

Acceso al juego usando Canvas o SVG

• react-konva - React Konva es un JavaScript biblioteca para dibujar gráficos de tela complejos con enlaces al Marco Konva.
• react-sketch - Una herramienta Sketch para React aplicaciones basadas, respaldadas por FabricJS
• react-sketch-canvas - Demo Herramienta de dibujo vectorial de mano libre para React usando SVG como lienzo. Acepta la entrada de Mouse, táctil y tabletas gráficas
• react-heat-map - Un mapa de calor del calendario ligero react componente construido en SVG, versión personalizable de GitHubEs el gráfico de la contribución.

Captura

• html2canvas - Tome imágenes de cualquier parte de su página web utilizando Javascript.

Varios

• puck - demo - El editor visual auto hospedado React
• react-advanced-news-ticker - demo - Un componente de ticker vertical flexible y animado
• react-avatar-generator - Permite a los usuarios crear kaleidoscopios aleatorios para ser utilizados como avatares.
• react-awesome-query-builder - demo - Generador de consultas visuales de campos de formularios, con SQL, MongoDB y JSON exportados
• react-blur - React componente para fondos borrosos.
• react-demo-tab - demo - A React componente para crear fácilmente demos de otros componentes.
• fastcomments-react - demo - Componente FastComments para insertar un hilo de comentario en vivo en una página o SPA.
• react-pdf-viewer - docs - A React componente para ver un PDF documento.
• react-simple-chatbot - demo - Un simple componente de chatbot para crear conversaciones.
• react-file-reader-input - Componente de entrada de archivos para el control del estilo de lectura de archivos y abstracción.
• react-filter-control - El React filterbuilder componente para construir los criterios de filtro en el UI.
• react-headings - Auto-incremento tu HTML epígrafes (h1, h2, etc.) para mejorar la accesibilidad y SEO, no importa su estructura de componentes, mientras que usted mantiene el control completo de lo que se ha renderizado.
• react-joyride - Crear paseos y visitas guiadas para su ReactJS aplicaciones. ¡Ahora con herramientas independientes!.
• react-mouse-select - Demo Un componente que permite seleccionar DOM elementos moviendo el ratón
• react-resizable-and-movable - Componente desmontable y móvil React.
• react-resizable-box - Componente incautable React. #reactjs.
• react-searchbox-awesome - demo - Caja de búsqueda minimalista.
• react-split-pane - React componente split-pane.
• react-swipe-to-delete-ios - demo - Eliminar un artículo en una lista de la misma manera que iOS.
• react-swipeable-list - demo - Componente configurable para renderizar lista con elementos intercambiables.
• typography - Un poderoso kit de herramientas para construir sitios web con hermosa tipografía.
• react-pulse-text - demo/docs - Le permite animar el texto de cualquier propiedad de otro componente.
• captcha-image - Permite generar una imagen captcha aleatoria con opciones.
• react-pdf - Mostrar PDF en su React app tan fácilmente como si fueran imágenes.
• react-customizable-chat-bot - Demo - Construya su propio chatbot que coincida con sus necesidades de marca en minutos.
• @restpace/schema-form - Demo - Construir fácilmente formas complejas automáticamente desde un esquema JSON.
• react-darkreader - A React Busca agregar un modo oscuro/noche a tu sitio inspirado en darkreader.
• react-apple-signin-auth - Apple signin para React usando el SDK oficial de Apple JS.
• react-mrz-scanner - A React componente para escanear MRZ en pasaportes, tarjetas de visa, etc. Está basado en Dynamsoft Label Reconocer.

Componentes de formulario

Dejar que el usuario introduzca datos

Fecha Time picker

Colector de destino / selector de tiempo / selector de fecha / selector de rango de fechas

• date-range-picker - demo - Un componente de calendario que soporta las selecciones de fechas, rangos.
• react-big-calendar - Gcal/outlook como componente de calendario.
• react-datepicker - Un componente sencillo y reutilizable de datepicker React.
• react-day-picker - Picker de fecha flexible para React.
• react-flatpickr - Flatpickr para React.
• react-simple-timefield - demo - Campo de entrada de tiempo simple.
• react-timezone-select - demo - Zona horaria dinámica y sucinta. Basado en react-select.
• DevExtreme React Scheduler - Programador/calendar basado en plugins de alto rendimiento Material Design.
• jQWidgets Scheduler - Función completa biblioteca de programación.
• react-calendar - Calendario final para su React app.
• react-date-picker - Un goleador de citas para tu React app.
• schedule-x - Material design calendario de eventos y componentes de la fecha. Sitio de demostración: https://schedule-x.dev/

Emoji picker

• interweave-emoji-picker - A React emoji picker basado alimentado por Interweave y Emojibase.

Tipos de entrada

Masked entradas, entradas especializadas; email / teléfono / tarjeta de crédito / etc.

• react-credit-cards - Hermosas tarjetas de crédito para sus formularios de pago.
• react-payment-inputs - demo - Un contenedor de cero dependencia para ayudar con campos de entrada de tarjetas de pago.
• react-input-mask - demo - Otro react componente para el enmascaramiento de entrada.
• @lunasec/react-sdk - docs - Componentes de forma seguras y endurecidas que encriptan/tokenizen todos los datos automáticamente.
• react-numpad - demo - Control de remo de número extensible para números, fechas y tiempos.
• react-multi-email - demo - Formato de múltiples correos electrónicos como los tipos de usuario.

Autocompleto

Autosuggest / autocompleto / typeahead

• react-autosuggest - WAI-ARIA obediente React componente autosuggest.
• react-typeahead - Puro react- tipoahead y tipoahead-tokenizer.

Seleccione

• react-aria-menubutton - Un totalmente accesible, fácilmente temático, React- Botón de menú potenciado.
• react-functional-select - demo - Componente selecto micro-optimizado de tamaño React.js.
• react-mobile-picker - demo - Un componente de caja seleccionado como iOS.
• react-select - Un control selecto construido con y para React JS.
• react-column-select - Un componente selecto de columna construido para react.
• react-select-search - demo - Un componente selecto ligero React

Color Picker

• coloreact - Un pequeñito Color Picker para React.
• react-color - Es un pequeño componente de widget de color para React aplicaciones.
• react-colorful - Un pequeño componente (2,5 KB), libre de dependencia, rápido y accesible.
• react-input-color - React componente de color de entrada con el selector de color hsv.

Toggle

• @anatoliygatt/heart-switch - demo - Un componente de interruptor de toggle en forma de corazón totalmente temático y accesible.
• react-ios-switch - React componente de interruptor.
• react-toggle - Un componente elegante y accesible para la lucha ReactTambién una casilla de verificación glorificada.
• ui-switch - El componente más completo Toggle

Slider

• react-slider - Componente deslizante para React.

Radio Button

• react-radio-group - Mejor botones de radio.

Seleccione

Deja que el usuario seleccione algo (por ejemplo, una etiqueta) mientras escribe

• react-autocomplete-input - Campo de entrada autocompleto React.
• react-mentions - Mencionar a la gente en un área de texto.
• rich-textarea - Un texto para colorear, resaltar, decorar textos y ofrecer autocompleto.

Tag Input

Deja que el usuario agregue múltiples etiquetas en una sola entrada

• react-tag-input - Un componente de etiquetado fantásticamente simple para su React proyectos.
• react-tagsinput - Un simple react componente para las etiquetas de entrada.
• react-tokeninput - Componente de Tokeninput para React.
• tagify - demo & docs - Ligero, eficiente componente de entrada Etiquetas.

Automatizar la entrada / Textarea

• react-input-autosize - Campo de entrada automático para React.
• react-autowidth-input - Campo de entrada de tamaño automático de alta configurable y extensible construido con ganchos.
• react-textarea-autosize - <textarea / límite; componente para React que crece con contenido.

Star Rating

• react-rating - demo - Cero-dependencia, componente de calificación altamente personalizable.
• react-awesome-stars-rating - demo - El componente estrella con accesibilidad.
• react-star-rating-input - React.js componente para entrar 0-5 (o más) estrellas.

Arrastre y suelte

• react-beautiful-dnd - Hermoso y accesible arrastrar y soltar para listas con React
• react-dnd - Arrastre y suelte React.
• react-drag-sizing - “Drag to resize” (size) como React Componente.
• react-draggable - React componente arrastrable.
• react-dragula - Arrastre y suelte tan simple que duele.
• react-dropzone - Zona simple de arrastrar HTML5 con React.js.
• react-movable - Biblioteca accesible y minimalista (traducido4kB gzipped) para arrastrar verticalmente y soltar en listas y tablas.
• react-sortable-pane - Componente de panel clasificable y reizable para React.
• neodrag - Bibliotecas multiframework para arrastrar. Elija su marco, el comportamiento de arrastrar API seguirá siendo el mismo.

Lista clasificable

Deja que el usuario defina un pedido en una lista

• react-anything-sortable - Clasifique a cualquier niño con soporte táctil y compatibilidad con IE8.
• sortablejs - Listas reordenables por arrastrar y soltar, dentro y entre las listas.

Rich Text Editor

• alloyeditor - WYSIWYG editor basado en CKEditor con completamente reescrito UI.
• ckeditor4-react - Un envoltorio oficial de editor de texto CKEditor 4 rico.
• ckeditor5-react - Un envoltorio oficial del editor de texto CKEditor 5 rico.
• draft-js - A React framework for building text editors.
• edtr-io - demo - docs - WYSIWYG editor web en línea con plugins.
• megadraft - Rich Text editor construido en la parte superior de draft.js.
• react-ace - Ace (Advanced Code Editor) envoltorio.
• react-codemirror - demo - Componente de CodeMirror React.
• react-contenteditable - React componente para un div con contenidos editables.
• react-draft-wysiwyg - WYSIWYG editor construir sobre DraftJS.
• react-editor - Editor sencillo de texto rico que puede insertar imágenes y HTML.
• react-medium-editor - Envoltorio de media-editor.
• react-monacoeditor - Componente de editor de Mónaco React.
• react-simple-code-editor - Simple no-frills code editor con resaltado sintaxis
• react-quill - Bastante envoltorio.
• react-trumbowyg - Trumbowyg Envoltorio.
• remirror - demo - docs - ProseMirror toolkit para React.
• slate - demo - docs - Un marco completamente personalizable para construir editores de texto ricos.
• smartblock - demo - docs - Editor WYSIWYG basado en ProseMirror.
• tiptap - demo - docs - El marco de editor sin cabeza para artesanos web.

Markdown Editor

• react-simplemde-editor - React envoltura del componente para EasyMDE (the most fresh SimpleMDE fork).
• react-markdown-editor - A markdown editor ReactReflujo.
• react-md-editor - Un simple markdown editor con vista previa, implementado con React.js y TypeScript.

Edición de imagen

Manipulación de imágenes

• react-avatar-editor - Facebook-como, avatar / componente de imagen de perfil.
• react-avatar-generator - Generar kaleidoscopio divertido para avatares de usuario.
• react-easy-crop - Componente para cortar/rotar imágenes/vídeos con interacciones fáciles. Qué amable.
• react-image-crop - Una herramienta de reproducción de imagen sensible para React.
• react-image-cropper - Imágen de cultivo.
• react-advanced-cropper - A react la biblioteca de cultivos para crear el cosechador exactamente adecuado para su sitio web design.
• react-mobile-cropper - Una biblioteca de reproducción de imágenes lista para usar altamente inespírita por los populares cosechadores Android. Basado en react-advanced-cropper.

Colecciones de componentes de formulario

• formsy-material-ui - Un envoltorio de compatibilidad con formas para Material UI componentes de forma.
• formsy-react-components - Un conjunto de React Componentes de la JS para su uso en formareact forma.
• react-input-enhancements - Conjunto de mejoras para el control de entrada.
• react-widgets - Un & agrave; la carta conjunto de entradas pulidas, extensibles y accesibles.

Varios

• @anatoliygatt/numeric-stepper - demo - Un componente de escalón numérico totalmente temático y accesible.
• interweave - React biblioteca para renderizar con seguridad HTML, atributos de filtro, texto de autocompra con emparejadores, renderizar caracteres emoji, y mucho más.
• react-designer - Fácil de configurar, ligero, gráficos vectoriales editables en su react componentes.
• react-upload-gallery - React para Subir Galería de imágenes. Arrastre ” Tirar, Ordenar, Personalizar.

Sintaxis Highlight

• react-syntax-highlighter - Componente de resaltado sintaxis con Prismjs o Highlightjs AST usando estilos inline.

UI A ti

Back to top ⬆️

Components to layout the app’s UI

• autoresponsive-react - Biblioteca de diseño receptivo automático.
• hedron - Un sistema de cuadrícula flexbox sin refrigeración, alimentado por componentes con estilo.
• m-react-splitters - Componente de separación, escrito en TypeScript.
• muuri-react - demo - docs - Diseños de rejilla responsable, clasificables, filtrables y arrastrables.
• react-grid-layout - Un diseño de cuadrícula arrastrable y reparable con puntos de ruptura sensibles, para React.
• react-layman - demo - Gestor de diseño dinámico con pestañas
• react-masonry-component - Wrapper para la Masonería de @desandro.
• react-reflex - Componente de contenedor de diseño flexible para avanzado React aplicaciones web.
• react-spaces - demo/docs - Piezas ancladas, resistentes y de desplazamiento.
• react-stonecutter - Componente de diseño de cuadrícula animada.
• react-colrow - Componentes de diseño de cuadrícula responsable. Basado en css flexbox. Soporte ancho de la fracción, auto crecimiento.
• react-schematic - demo - Construir diseños sensibles usando esquemas de estilo sin una sobrecarga de cualquier configuración temática

UI Animación

Back to top ⬆️

Animate transitions

• data-driven-motion - Fácilmente anima tus datos.
• react-animatable - Una biblioteca de animación usando la API de Animaciones Web.
• react-anime - Una biblioteca de animación súper fácil.
• react-flip-move - Animación sin esfuerzo entre DOM cambios (por ejemplo, reordenamiento de lista) utilizando la técnica FLIP.
• react-gsap-enhancer - Utilice el poder completo React y GSAP juntos.
• react-tsparticles - Un componente ligero para crear animaciones interactivas de partículas
• react-motion - Un resorte que resuelve tus problemas de animación.
• react-mt-svg-lines - Wrapper para animar el trazo de línea en SVGs.
• react-router-transition - Transiciones construidas para react-reuter, alimentado por react- emoción.
• react-spring - Una biblioteca de animación basada en la física de primavera.
• react-ts-typewriter - demo - Fácil de usar y efecto de máquina de escribir personalizable para cualquier texto.
• framer-motion - Una biblioteca de animación y gestos.
• react-spark-scroll - Acciones y animaciones basadas en la ranura para react.
• react-track - Seguimiento de la posición de DOM elementos. Cree animaciones geniales.
• react-transitive-number - Aplicar efecto de transición a cadenas numéricas, a los viejos temporizadores de Groupon.
• react-web-animation - React componentes para la API de Animaciones Web -.
• auto-size-transition - Un componente que escala dinámicamente según el tamaño interno de los niños
• react-particles-bg - Partículas de fondo.
• gooey-react - demo/docs - El efecto gooey para React, utilizado para la toma de forma / metaballs.
• react-voodoo - demo/samples - Motor de animación aditivo que permite animaciones complejas como android/iOs, renderizando deslizadores en SSR, inercia predictiva, multitouch, etc

Parallax

• simple-parallax-js - demo - La manera más fácil de conseguir un efecto paralaje con React y JavaScript en imágenes
• react-parallax-tilt - demo - Aplicar fácilmente el efecto paralaja de inclinación en los componentes.

UI Marcos

Back to top ⬆️

Responsabilidad

Set of components + responsive layout system

• ant-design - demo/docs - A UI Design Idioma de China. Individual components disponible.
• atlaskit - Funcionario de Atlas UI biblioteca, con componentes de badge a tree table .
• base web - Base Web es una base para iniciar, evolucionar y unificar productos web.
• carbon - demo/docs - A design system built by IBM.
• cdbreact - demo - docs - Elegante UI Biblioteca de kits y componentes reutilizables para la construcción de sitios web y aplicaciones web móviles.
• chakra-ui - demo/docs - Simple, modular y accesible UI Componentes para su React Aplicaciones.
• ChatUI - demo/docs - El UI design idioma y idioma React biblioteca para Conversational UI
• CoreUI for React - demo/docs - Fuente abierta UI biblioteca de componentes.
• evergreen - demo/docs - Evergreen React UI Marco por Segment.
• fluentui - Marcos UX para crear aplicaciones hermosas y multiplataformas que comparten code, design, y comportamiento de interacción.
• gestalt - demo/docs - Un conjunto de componentes compatibles con Pinterest design lenguaje.
• grommet - El marco UX más avanzado para aplicaciones empresariales.
• kokonut-ui - Libre Moderno y Personalizable UI componentes.
• Mantine - demo/docs - Una biblioteca con 100+ ganchos y componentes con native apoyo temático oscuro
• orbit - Componentes para construir proyectos orientados al viaje.
• flowbite-react - Fuente abierta UI biblioteca de componentes basado en React, Tailwind CSSY Flowbite.
• primereact - Un completo UI Marco con componentes 50+ material, bootstrap y temas personalizados.
• radix-ui - Componentes sin estilo y accesibles para la construcción de alta calidad design sistemas y aplicaciones web.
• react-bootstrap - Bootstrap componentes construidos con React.
• react-foundation - Foundation as React componentes.
• reakit - demo/docs Herramienta para crear aplicaciones web ricas accesibles
• searchkit - React UI componentes / widgets. La forma más fácil de construir una gran experiencia de búsqueda con Elasticsearch.
• semantic-ui-react - El oficial Semántico…UI-React integración.
• semi-design - demo/docs - Un moderno, amplio, flexible design sistema.
• shadcn/ui - demo - docs - Hermosos componentes diseñados que puedes copiar y pegar en tus aplicaciones.
• shineout - demo - Conjunto de componentes compatibles con China: elementos de forma, navegación, mesa, árbol, árbol selecto desplegable etc.
• Tremor - demo - docs - Componentes de código abierto para construir gráficos y paneles.
• untitled-ui-react - demo - Hermosa colección de componentes construidos con React Aria y Tailwind CSS.

Material Design

• 🚀 Material UI - Suite completa de componentes. Construya su propio design sistema, o empezar con Material Design.
  • Autocomplete - Autocompleto accesible, combobox, multiselect
  • Material Icons - 1.000+ SVG material iconos.
  • Modal - Componente de diálogo modal accesible.
  • Slider - Componente deslizante accesible.
  • Table - tabla con clasificación, selección, paginación, virtualizado.
  • Tree View - Componente de vista de árbol accesible para React.
• react-essence - Esencia - El esencial Material Design Marco.
• react-materialize - Material design para react, alimentado por materializecss.
• react-toolbox - Un conjunto de React componentes implementando Google Material Design.
• mdbootstrap - React Bootstrap con Material Design

Móvil

• antd-mobile - Configurable Móvil UI de China.
• Ionic React - Marco Iónico: crear fácilmente aplicaciones web Android, Desktop y Progresiva con una code Base.
• OnsenUI - demo/docs - Marco de aplicación móvil con Material y diseños planos (iOS). Basado en componentes web.

Colecciones de componentes

• blueprint - demo - docs - UI toolkit para la construcción de interfaces web complejas de datos para aplicaciones de escritorio (no móviles).
• dataminr-react-components - Colección de reutilizables React Componentes y funciones de utilidad.
• shards-react - docs/demo - Una hermosa y moderna React design sistema. Freemium.
• aframe-react - Cree experiencias de realidad virtual con A-Frame y React.
• react-admin - Construir experiencias de usuario de administrador en la parte superior de los servicios de REST y GraphQL.
• refine - demo - docs - Construir aplicaciones de gran densidad de datos en poco tiempo. Naves con Ant Design System, an enterprise-level UI Herramienta.
• matrix-card - demo - Componente más simple posible para generar tarjetas de estilo de lluvia matriz.
• rsuite - demo/docs - Suite de componentes para “productos del sistema de empresa”.
• lens-ui - docs - Un traje de componentes centrado en la simplicidad.
• Tailwindadmin - docs - Una colección de ShadCN listo UI componentes que puede conectar directamente en su React/Next.js proyectos.

UI Utilidades

Back to top ⬆️

Reporter

Informe estilos computed

Visibility Reporter

Informe cuando un componente se hace visible/hidden

• react-intersection-observer - React implementación de la API de Observador de Intersección.
• react-visibility-sensor - Componente sensor.
• react-waypoint - A React componente para ejecutar una función cada vez que se desplaza a un elemento.

Informe de medición

Determine e informe las mediciones de un elemento

• react-component-queries - Proporcione props a sus Componentes basados en su Ancho y/o Altura.
• react-container-dimensions - Componente Wrapper que detecta el tamaño del elemento.
• react-dimensions - React componente de mayor orden para obtener dimensiones de contenedor.
• react-height - Componente para determinar e informar a los niños elementos de altura.
• react-measure - Computar las mediciones de un React componente.
• react-sizeme - Haz tu React Componentes conscientes de su anchura y altura.

Entrada de dispositivos

Turn user input into actions

Eventos de teclado

• react-hotkeys - Dirección de área de foco y caliente declarativa React.
• react-key-handler - React componente para manejar eventos de teclado.
• react-keydown - Envoltura de cierre ligero para React componentes.
• react-shortcuts - Gestionar atajos de teclado de un lugar.
• useKeyCapture - Un gancho personalizado para facilitar a los oyentes de presión clave de un blanco/global.
• react-keyboard-navigator - Una suite de React componentes y gancho para seleccionar componentes de hermano a través del teclado.

Scroll Events

• react-scroll-components - Un conjunto de componentes que react a página de desplazamiento.

Touch Swipe

• react-swipe - Swipe.js como un React componente.

Mouse Eventos

• react-hook-mighty-mouse - demo - Hecho que rastrea los eventos del ratón en el elemento seleccionado.

Meta Etiquetas

Set meta tags,

• react-helmet-async - Casco seguro de pan para React 16+ y amigos
• react-helmet - Un director de documento para React.

Portal

Render un elemento a arbitrario DOM node

• react-layer-stack - Sistema de capa simple pero omnipresentemente potente y agnóstico para React.
• react-portal - React componente para el transporte de modales, cajas de luz, barras de carga… a documentar.body.

Test User Behavior

A / B pruebas, experimentos, …

• react-experiments - React componentes para la aplicación UI experimentos.

Code Design

Back to top ⬆️

Libros que ayudan con code design

Data Store

Flujo de datos / gestión de datos / tiendas de datos / componentes estado / flujo de datos

• baobab-react - React integración para Baobab.
• cerebral - Un controlador estatal con su propio depurador.
• effector-react - React vinculantes para el efector, un eficaz gerente de estado multi-tienda.
• fireproof - demo - docs Pure JS, cero dependencia, base de datos CRDT - funciona en el navegador y se conecta a cualquier nube o backend
• RxDB - demo - docs Una base de datos reactiva rápida y local para JavaScript Aplicaciones
• fluxible - Un contenedor enchufable para aplicaciones de flujo universal.
• kea - Arquitectura de alto nivel para React aplicaciones.
• react-i13n - Un enfoque performant, escalable y enchufable para instrumentar su React aplicación.
• react-redux - Oficial React vinculantes para Redux.
• redux-batched-actions - Reducir + acción para reducir las acciones bajo una sola notificación de suscriptor.
• redux - Contenedor de estado predecible para JavaScript aplicaciones.
• reselect - Biblioteca selectora para Redux.
• resourcerer - Marco de registro de datos declarado para API REST
• synergies - docs Una biblioteca performant y distribuida context-state para crear reutilizable React lógica del estado sinergizando piezas de contexto atomar.
• zustand - docs - Una solución rápida de gestión estatal con principios de flujo simplificados y gancho api sin caldera.
• teaful - Pequeño, fácil y poderoso React Administración estatal

Formulario Logic

• data-driven-forms - Una manera declarativa de construir formas con toda la funcionalidad.
• formik - Construir formas sin lágrimas y apoya la Validación en facilidad.
• formsy-react - Un constructor de entrada de formulario y validador para React JS.
• Phormal - Docs & Demos - Formas responsivas y multilingües con validación integrada, soporte para modos oscuros y lenguajes derecho a izquierdo.
• react-hook-form - React ganchos para validación de formularios sin la molestia.
• react-jsonschema-form - A React componente para la construcción de formas Web de JSONSchema.
• react-client-validation - Validación sencilla y super ligera para React.
• react-final-form - Gestión estatal basada en la suscripción
• react-formawesome - Biblioteca compleja para crear formas impresionantes.
• surveyjs - The advanced Survey and Form library
• Formily - Alto rendimiento, extensible y Typescript amigable
• hook-form-react - docs - Una solución ligera y sin dependencia React ganchos para validación de formularios.

Router

• react-router-component - Componente de router declarado React.
• react-router-scroll - React Gestión de desplazamiento de router.
• react-router - Una completa biblioteca de enrutamiento React.
• redux-first-history - Redux Primera historia - Redux historia de apoyo vinculante react-router - @reach/router - wouter
• universal-router - Un router de estilo medio simple para isomorfo JavaScript aplicaciones web.
• wouter - Una biblioteca de enrutamiento minimalista ~1.3KB. Nada más que ganchos.
• tanstack-router - router tipo seguro con caché incorporado URL Administración estatal

Props del servidor

Propiedades compartidas asincrónicamente traídas sobre la red

• react-refetch - Una manera sencilla, declarativa y composible de buscar datos para React componentes.
• redux-connect - Proporciona decorador para la resolución de propulsores asinc en react- Router.
• axios-react - Componente cliente HTTP React.

Comunicación con servidor

• apollo-client - Un simple cliente de caché para cualquier servidor GraphQL y UI marco.
• react-relay - Relay es un JavaScript marco para la construcción de datos React Aplicaciones.
• query - docs Gestión asincrónica potente del estado, utilidades del estado del servidor y búsqueda de datos para TS/JS, React, Solid, Svelte y Vue.

CSS / Estilo

• aesthetic - Un poderoso tipo seguro, marco agnóstico, CSS-en-JS biblioteca para componentes de estilo, ya sean objetos simples, importando hojas de estilo o simplemente haciendo referencia a nombres externos de clase.
• aphrodite - Es estilos de línea, pero funcionan!.
• inline-style-prefixer - Autoprefixer de tiempo de ejecución para objetos de estilo inline.
• @classmatejs/react - Un constructor de componentes centrado en el nombre de clase con una sintaxis como componentes de estilo y el azúcar de las variantes de cva.
• react-container-query - Componente de respuesta modular.
• react-responsive - Consultas en medios de comunicación react para responder design.
• reactponsive - Componentes y ganchos responsables.
• styled-components - Primitivos visuales para la edad del componente.
• stitches - CSS-en-JS con tiempo de ejecución cerca de cero, SSR, soporte multivariante.

HTML Plantilla

• jsx-control-statements - Neater si y para React JSX.

Aplicaciones Isomorfos

• hypernova - Un servicio para renderizar el lado servidor JavaScript vistas.
• isomorphic-style-loader - Isomorfo CSS cargador de estilo para Webpack.
• react-server - React marco con renderizado servidor para la carga rápida de página.
• rill - Marco de aplicación web universal.
• webpack-isomorphic-tools - renderizado lado del servidor para sus aplicaciones Webpack (por ejemplo. React).

Boilerplate

Scaffold / kit de arranque / generador Yeoman / en stacksemble / seed

• create-react-app - Crear React aplicaciones sin configuración de compilación.
• crisp-react - Integración expresa en TypeScript con soporte para múltiples SPAs y evitación de caídas.
• cra-template-redux-auth-starter - A Redux auth starter caldera para CRA.
• electron-react-boilerplate - Desarrollo de edición en vivo en la aplicación de escritorio.
• elegant - docs - demo - Un simple React marco para construir rápidamente aplicaciones web hermosas y expresivas con Next.js, Tailwind CSS, y Markdown cargando.
• extensive-react-boilerplate - Boilerplate con Next.js, Auth (Iniciar sesión, Restablecer contraseña, Confirmar email, Refresh Token), Material UI, React Formulario de gancho, I18N, Carga de archivos (apoyar controladores locales y Amazon S3), Tests, CI.
• generator-starhackit - Kit de arranque completo.
• nwb - CLI tool and devDependency for React aplicaciones y componentes y módulos npm.
• nx - Sistema de construcción de próxima generación con soporte monorepo de primera clase e integraciones poderosas.
• PBandJ - Cero-Config Marco de componentes reutilizables.
• react-hot-boilerplate - Placa de caldera minimal en vivo para su siguiente ReactJS proyecto.
• rockpack - Solución sencilla para crear React aplicación con SSR, llenado, forro, pruebas en 5 minutos.
• create-react-dependency - Crear react dependencias sin configuración de construcción.
• phoenix - Una sencilla caldera que le ayuda a hacer su react aplicación con Server Side Rendering & Localization support.
• react-enterprise-starter-kit - Awesome altamente escalable y performant React Kit de inicio para una aplicación de empresa con una base de código muy fácil de mantener.
• Tailwindadmin - Plantilla de panel de Shadcn libre construida en React y Tailwind CSS viene con soporte de trabajo múltiple

Varios

• react-inlinesvg - Un componente de carga SVG ReactJS.
• react-godfather - Una nueva manera de escribir Componentes funcionales, sin ganchos.
• react-vvm - Un nuevo enfoque de MVVM en React, para hacer cumplir la separación limpia de las preocupaciones, reducir la caldera y la optimización automática de re-render para escalable UI lógica.
• react-call - Llama a tu React componentes.
• redux-auth-patch - Sistema completo de autenticación token para react + redux que soporta la renderización isomorfa.
• redux-search - Redux vinculantes para búsqueda lado cliente.
• tcomb-react - Sintaxis alternativa para PropTypes.
• react-universal-hooks - :tada: apoyo react ganchos por todas partes (Functional o Class Component).

Utilidades

Back to top ⬆️

• qrcode.react - Un componente <QRCode/corporagt; para uso con React.
• <qr-code> – A no-dependencies, customizable, animate-able, SVG-based <qr-code> element.
• react-children-utilities - Servicios ampliados para ReactNiños.
• react-media - A CSS componente de consulta de los medios de comunicación React.
• react-middle-ellipsis - demo - Truncate largas cuerdas en el medio en lugar del final.
• react-translate-component - Contenido de texto multilingüe/localizado.

i18n

Internacionalización / L10n / localización / traducción

• react-i18next - Internacionalización react hecho bien. Usando el i18next i18n ecosistema.
• react-intl - Internationalize React aplicaciones.
• react-localized - Internacionalización React componentes basados en gettext formato.
• react-translate-maker - Internacionalización universal (i18n) biblioteca de código abierto para React.
• react-intl-universal - demo Internationalize React aplicaciones. No sólo para ReactComponente pero también para Vanilla JS.
• @tolgee/react - docs – Herramienta de localización basada en la web que permite a los usuarios traducir directamente en la React aplicación que desarrollan
• js-lingui - docs – Una internacionalización legible, automatizada y optimizada (5 kb) JavaScript.

Marcos de unión / integraciones

• backbone-react-component - Un poco de pegamento nifty que conecta automáticamente tus modelos Backbone.
• elm-react-component - A React componente que envuelve un módulo Elm para ser utilizado en un React aplicación.
• gl-react - OpenGL / WebGL fijaciones para React para implementar efectos complejos sobre imágenes y contenidos.
• react-backbone - Mezclas de cúpula para la cúpula react y mucho más.
• react-d3-library - Biblioteca de código abierto para usar D3 en React.
• react-elm-components - Escriba React componentes en Elm.
• react-famous - React puente a Famo.us.
• react-localstorage - Implementación sencilla de almacenamiento local para Facebook plaga#39;s React.
• react-lottie-player - demo - Un jugador de animación de lotie.
• react-on-rails - Integración React + Mochila web + Rails para construir aplicaciones universales (Isomorphic).
• react-three-renderer - Render en un lienzo de tres.js React.
• react-threejs - Limitaciones más simples entre React Tres.js
• reactfire - ReactJS mixin for easy Firebase integration.
• reactive-elements - Permite utilizar React.js componente HTML elemento ( componente de laboratorio).
• react-unity-webgl - Intergración de unidad con comunicación bidireccional utilizando un sistema de eventos integrado.

Integración con servicios de terceros

• react-ga - React Módulo Google Analytics.
• react-google-analytics - Componente de análisis de Google.
• react-google-autocomplete - Google Places API componentes y ganchos.
• react-recaptcha - A react.js reCAPTCHA para Google.
• react-stripe-checkout - Carga de rayas hacia#39; s checkout.js como un react componente. La forma más fácil de usar con el checkout React.
• redux-segment - Segment.io integración analítica para redux.
• react-slack-notification - Enviar mensajes y registros de errores a un canal Slack directamente.
• react-firebase-hooks - Ganchos para integrar bomberos en su aplicación.

Ejecución

Back to top ⬆️

UI

• inferno - Un extremadamente rápido, React- Como JavaScript biblioteca para construir interfaces de usuario modernas.
• react-fastclick - Eventos rápidos de tacto React.
• react-static-container - Renders contenido estático eficientemente.

Inspección

• react-perf-tool - Debug performance of your React aplicación.
• react-render-visualizer - Visualizador de render para ReactJS.

Lazy Load

• react-infinite-grid - A React componente que hace una rejilla de elementos.
• react-infinite - Un contenedor de desplazamiento eficiente para navegador basado en UITableView.
• react-lazy-load - React componente que da elementos a los niños cuando entran en el mirador.
• react-lazyload - Desactiva tu componente, imagen o cualquier cosa importa el rendimiento.
• react-virtualized - React componentes para renderizar eficientemente listas grandes y datos tabulares.

App Size

• babel-plugin-transform-react-remove-prop-types - Eliminar innecesariamente React propTypes.
• react-lite - Aplicación React que optimiza para pequeño tamaño de script.

Server-Side Rendering

• iSSR - La manera más fácil de mover su React aplicación a Server-Side Rendering. Manijas Efectos secundarios y sincroniza el Estado.
• react-esi - Una biblioteca para aumentar el rendimiento de SSR exponiendo React componentes como fragmentos de Edge Side (ESI)

Herramientas de Dev

Back to top ⬆️

Prueba

• enzyme - JavaScript Servicios de prueba para React.
• jest-cli - Painless JavaScript Probando.
• react-unit - Biblioteca de pruebas de unidad ligera para ReactJS.
• redux-test-recorder - A redux middleware para generar automáticamente pruebas para los reductores a través ui interacción.
• rut - React pruebas fáciles con react-test-rendererApoyos DOM y renderizadores personalizados.
• unexpected-react - Plugin para inesperado para permitir la prueba completa React virtual DOM, y también el renderizador poco profundo.
• playwright enables reliable end-to-end testing for modern web apps.

Redux

• redux-devtools-chart-monitor - Un monitor gráfico para Redux DevTools.
• redux-devtools-dock-monitor - Un muelle removible y móvil para Redux DevTools monitorea.
• redux-devtools-filterable-log-monitor - Monitor de vista de árbol filtrable para Redux DevTools.
• redux-devtools-inspector - Otro Redux DevTools Monitor.
• redux-devtools-log-monitor - El monitor predeterminado para Redux DevTools con vista a los árboles.
• redux-devtools - DevTools for Redux con recarga caliente, repetición de acción y personalizable UI.
• remote-redux-devtools - Redux DevTools remotamente.

Inspección

• fluxguard - Control del cambio PROD que destaca todos DOM + design cambios.
• react-inspector - Power of Browser DevTools inspectores justo dentro de su React app.
• reactotron - Una aplicación CLI y OS X para inspeccionar su React JS and React Native aplicaciones.
• Tail Lens - Tailwind editor en el navegador : Inspección, edición, vista previa, copia.

Varios

• component-controls - demo - docs - Una herramienta de próxima generación para crear sitios de documentación rápidos.
• cosmos-js - Herramienta DX para diseñar realmente encapsulado React componentes.
• react-demo-tab-cli - CLI herramienta para crear demos de react componentes.
• react-styleguidist - React generador de guía de estilo.
• standard-react - JavaScript Guía de estilo estándar.
• Plasmic - Poderoso design herramienta para construir su React componentes visualmente.
• SimpleLocalize - Fuente abierta herramienta CLI para encontrar i18n llaves React proyectos.
• react-device-frameset - React componente de marco de dispositivo.

Varios

Back to top ⬆️

• DataFormsJS JSX Loader - Pequeñas JavaScript Compilador para convertir JSX rápidamente a JS directamente en una página web.
• html-to-react-components - Extract annotated portions of HTML en React componentes como módulos separados.
• htmltojsx - Automáticamente AJAXify plain HTML con el poder de React¡Es magia!
• jsonx - React JSON Syntax.
• mozaik - Moza adultiuml;k es una herramienta basada en nodejs / react / d3 / stylus para crear fácilmente hermosos paneles.
• react-blessed - A react Rendidor para bendito.
• jsondiffpatch-react - JSON diffing.
• iron-session - Biblioteca de sesión segura, apátrida y basada en cookies.

Static Website Generator

• gatsby - Transformar texto plano en blogs dinámicos y sitios web usando React.js.

Cloud Solutions

Back to top ⬆️

Base de datos

• BCMS - Sistema de gestión de contenidos basado en API, de código abierto y autoapropiado para Gatsby, Nuxt y Next.
• crisp-bigquery - Montaje completo Google BigQuery con Express TypeScript.
• react-server-routing-example - Universal cliente/servidor enrutamiento y datos con AWS DynamoDB.