Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
react-frontend-toolkit
A curated list of essential libraries and tools for frontend developers, with a focus on React. Ideal for developers looking to build robust, scalable, and high-performance applications 🚀.
https://github.com/drbarzaga/react-frontend-toolkit
Last synced: 3 days ago
JSON representation
-
🧰 React Frontend Toolkit
-
Drag & Drop
- FormKit’s Drag and Drop - first drag and drop sorting and transferring for lists in your app. It’s simple, flexible, framework agnostic, and clocks in at only ~4Kb gzipped.
- Swapy - agnostic tool that converts any layout into a drag-to-swap one with just a few lines of code.
- DnDKit
- React Beautiful DnD - and-drop library for lists with React.
- SortableJS - and-drop lists.
- React Dragula - and-drop library for React based on Dragula.
- Swapy - agnostic tool that converts any layout into a drag-to-swap one with just a few lines of code.
- DnDKit
- React Beautiful DnD - and-drop library for lists with React.
- SortableJS - and-drop lists.
- React Dragula - and-drop library for React based on Dragula.
- React Complex Tree - Select and Drag-And-Drop.
- React Complex Tree - Select and Drag-And-Drop.
-
Popular Platforms
- Scrimba
- freeCodeCamp
- Codecademy
- Egghead.io
- freeCodeCamp
- Codecademy
- Frontend Masters - depth courses on React and other frontend technologies taught by industry experts.
- Egghead.io
- Scrimba
- Scrimba
- Scrimba
- Scrimba
-
📢 Share
- ![LinkedIn - frontend-toolkit&title=React%20Toolkit%20Collection&summary=Check%20out%20this%20awesome%20React%20toolkit%20collection!&source=LinkedIn)
- ![Reddit - frontend-toolkit&title=React%20Toolkit%20Collection)
- ![Twitter - frontend-toolkit)
- ![Facebook - frontend-toolkit)
- ![LinkedIn - frontend-toolkit&title=React%20Toolkit%20Collection&summary=Check%20out%20this%20awesome%20React%20toolkit%20collection!&source=LinkedIn)
- ![Reddit - frontend-toolkit&title=React%20Toolkit%20Collection)
-
🚀 React Frontend Toolkit CLI
-
Frameworks
- Next.js - side rendering and static site generation for building fast and SEO-friendly web applications.
- Next.js - side rendering and static site generation for building fast and SEO-friendly web applications.
- Gatsby - based open-source framework for creating fast, secure, and powerful websites using modern web technologies.
- Remix
- RedwoodJS - stack, serverless web application framework built on React, GraphQL, and Prisma.
- Gatsby - based open-source framework for creating fast, secure, and powerful websites using modern web technologies.
- Remix
- Blitz.js - stack experience with a focus on developer productivity.
- RedwoodJS - stack, serverless web application framework built on React, GraphQL, and Prisma.
- React Admin - page applications on top of REST/GraphQL APIs, using TypeScript, React and Material Design.
- Refine
-
ℹ️ About
-
Authentication
-
Tables
- AG Grid - rich datagrid designed for the major JavaScript frameworks.
- React Data Grid - like grid component built with React.
- Griddle
- React Virtualized
- Tanstack Table
- AG Grid - rich datagrid designed for the major JavaScript frameworks.
- React Data Grid - like grid component built with React.
- Griddle
- React Virtualized
- Tanstack Table
- AG Grid - rich datagrid designed for the major JavaScript frameworks.
-
Forms
- React Hook Form - to-use validation.
- Tanstack Form
- React Json Schema Form
- Formily
- React Hook Form - to-use validation.
- Tanstack Form
- Formik
- React Json Schema Form
- Formily
-
Hooks
-
Notifications
- Sonner
- Sonner
- React Toastify - to-use toast notifications to your React applications.
- Notistack
- Reapop
- React Toastify - to-use toast notifications to your React applications.
- Notistack
- Reapop
- React Hot Toast
- React Notification System
- React Toast Notifications
- React Hot Toast
- React Notification System
- React Toast Notifications
-
Routing
-
State Management
- Zustand - management solution.
- Tanstack Store
- Redux Toolkit
- Recoil
- Zustand - management solution.
- Tanstack Store
- Redux Toolkit
- Recoil
-
Styling
- TailwindCss - first CSS framework for rapidly building custom user interfaces.
- Styled Components
- Emotion - in-JS library.
- Vanilla Extract - runtime Stylesheets-in-TypeScript
- Emotion - in-JS library.
- Vanilla Extract - runtime Stylesheets-in-TypeScript
-
Virtualization
-
Charts
- Recharts
- React-Vis
- ECharts for React
- Visx - level visualization components for React.
- React Flow - based editors and interactive diagrams.
- Nivo
- Recharts
- React-Vis
- ECharts for React
- Visx - level visualization components for React.
- React Flow - based editors and interactive diagrams.
- Unovis
-
UI Components
- Eldora UI - source animated components built with React, Typescript, Tailwind CSS, and Framer Motion.
- Radix UI
- Material UI - source React component library that implements Google's Material Design.
- Flowbite React - source UI component library built on top of Tailwind CSS with React components and based on the Flowbite Design System.
- Next UI
- Evergreen
- Chakra UI
- Mantine
- Ant Design
- Blueprint - based UI toolkit for the web.
- FluentUI
- Ariakit
- NativeBase - first, accessible components for React Native & Web to build consistent UI across Android, iOS and Web.
- Shadcn UI
- Eldora UI - source animated components built with React, Typescript, Tailwind CSS, and Framer Motion.
- Radix UI
- ZenUI
- Material UI - source React component library that implements Google's Material Design.
- Material Tailwind - source library that uses the power of Tailwind CSS and React to help you build unique web projects faster and easier.
- Flowbite React - source UI component library built on top of Tailwind CSS with React components and based on the Flowbite Design System.
- Next UI
- Evergreen
- Chakra UI
- Mantine
- Ant Design
- Blueprint - based UI toolkit for the web.
- FluentUI
- Ariakit
- NativeBase - first, accessible components for React Native & Web to build consistent UI across Android, iOS and Web.
- Grommet - first projects for the web with an easy to use component library.
- Reakit
- FlyonUI - source Tailwind CSS Components Library with semantic classes and powerful JS plugins.
- DaysiUI
- Headless UI
- React Email
- React Bootstrap
- PrimeReact - rich UI components.
- Grommet - first projects for the web with an easy to use component library.
- Reakit
- ZenUI
- FlyonUI - source Tailwind CSS Components Library with semantic classes and powerful JS plugins.
- DaysiUI
- Headless UI
- React Email
- React Spectrum Libraries
-
Icons
- Material Icons
- Bootstrap Icons - source SVG icon library for Bootstrap.
- React Icons
- Font Awesome
- React Icons
- Font Awesome
- Heroicons - crafted SVG icons, by the makers of Tailwind CSS.
- Feather Icons - source icons.
- Heroicons - crafted SVG icons, by the makers of Tailwind CSS.
- Feather Icons - source icons.
- Material Icons
-
File Uploads
- React Dropzone - and-drop zone with React.
- Uppy
-
Animations
- React Spring - physics-based animation library for React.
-
Maps
- React Leaflet - source JavaScript library for mobile-friendly interactive maps.
- Google Maps React
- React Leaflet - source JavaScript library for mobile-friendly interactive maps.
- Google Maps React
-
Real-time Communication
-
Audio & Video
-
Validations
-
Search Engine Optimization
-
GraphQL
-
Bundlers
-
Linting & Formatting
-
DevTools
-
Testing
- Jest
- Vitest
- Playwright - to-end testing framework for web apps, with support for multiple browsers.
- Cypress
- Jest
- Playwright - to-end testing framework for web apps, with support for multiple browsers.
- Cypress
-
Documentation
-
File Upload
- React Dropzone - and-drop zone with React.
- Uppy
-
Video & Audio
-
Performance Optimization
-
Error Handling
- React Error Boundary
- React Error Boundary
- Sentry - time.
- Sentry - time.
-
Internationalization
-
Code Splitting
- Loadable Components - splitting React components and loading them on demand.
- React Loadable
- Loadable Components - splitting React components and loading them on demand.
- React Loadable
-
Hosting
-
Data Fetching
- Axios - based HTTP client for the browser and Node.js.
- Tanstack Query - state utilities, and data fetching for TS/JS, React, Solid, Vue, Svelte, and more.
- GraphQL Request
- Fetch API
- SWR
- Fetch API
- SWR
-
API Clients & Data Fetching
- Axios - based HTTP client for the browser and Node.js.
- Tanstack Query - state utilities, and data fetching for TS/JS, React, Solid, Vue, Svelte, and more.
- GraphQL Request
-
Visual Studio Code Extensions
- ES7+ React/Redux/React-Native snippets
- Simple React Snippets
- Prettier - Code formatter
- ESLint
- React PropTypes Intellisense
- VSCode React Refactor
- React Native Tools
- Jest
- Tailwind CSS IntelliSense
- GitLens - in Git capabilities of VS Code.
- Path Intellisense
- Code Spell Checker
- Live Server
- Paste JSON as Code
- Simple React Snippets
- Prettier - Code formatter
- ESLint
- React PropTypes Intellisense
- VSCode React Refactor
- React Native Tools
- Jest
- Tailwind CSS IntelliSense
- Auto Import
- Path Intellisense
- Code Spell Checker
- Live Server
- Nova.js Visual Studio Code Extension - free React hooks to your project without leaving VS Code
- Nova.js Visual Studio Code Extension - free React hooks to your project without leaving VS Code
-
Live Coding Tools
- CodeSandbox - time.
- StackBlitz
- JSFiddle
- CodePen - end designers and developers, offering a platform to build and share React projects.
- Replit
- CodeSandbox - time.
- StackBlitz
- JSFiddle
- CodePen - end designers and developers, offering a platform to build and share React projects.
-
GitHub Repositories
-
Forums
-
❤️ Support
-
✉️ Contact
-
Official Resources
-
Programming Languages
Categories
Sub Categories
UI Components
45
Visual Studio Code Extensions
28
Notifications
14
Drag & Drop
13
Documentation
12
Authentication
12
Popular Platforms
12
Charts
12
Validations
12
Icons
11
Frameworks
11
Tables
11
Hooks
9
Live Coding Tools
9
Forms
9
State Management
8
Data Fetching
7
Hosting
7
Testing
7
Styling
6
Official Resources
6
Performance Optimization
6
📢 Share
6
Search Engine Optimization
6
Forums
5
Audio & Video
5
Bundlers
5
ℹ️ About
5
Real-time Communication
4
✉️ Contact
4
DevTools
4
Linting & Formatting
4
Internationalization
4
Maps
4
Code Splitting
4
Routing
4
Error Handling
4
API Clients & Data Fetching
3
Virtualization
3
GraphQL
2
GitHub Repositories
2
🚀 React Frontend Toolkit CLI
2
File Upload
2
File Uploads
2
❤️ Support
2
Animations
1
Video & Audio
1
Keywords
react
40
typescript
6
javascript
6
notifications
6
list
4
grid
4
toast
4
performance
4
tabular-data
4
virtualization
4
frontend
4
windowing
4
sortable
4
drag-and-drop
4
reapop
2
notification
2
redux
2
redux-notifications
2
zero-dependency
2
router
2
toasts
2
snackbar
2
toast-notifications
2
headlessui
2
infinite-scroll
2
react-component
2
react-server-components
2
scrolling
2
solid
2
svelte
2
virtual-scroll
2
virtualized
2
vue
2
dnd
2
drag
2
reordering
2
draggable
2
multidrag
2
cli
2
developer-tools
2
frontend-developer
2
frontend-tools
2
toolkit
2
toolset
2
web-development
2
react-data-grid
2
customization
2
datagrid
2
plugins
2
table
2