Being a modern React developer is not about knowing just React itself. To stay competitive, it is highly recommended to explore the whole ecosystem.
In this article I've compiled some of the most useful React component libraries that you could use to speed up your developer workflow.
Those will include anything from working with forms, charts, calendars, tables, guides, popups, colors, animations, music, images and so much more.
1. react-hook-form
React Hooks for form state management and validation.
2. recharts
Redefined chart library built with React and D3.
3. react-big-calendar
An events calendar built for React and modern browsers.
4. react-beautiful-dnd
Beautiful and accessible drag and drop for lists with React.
5. react-table
A library for building powerful tables and data grids.
6. react-joyride
Create guided tours for your apps.
7. react-advanced-cropper
Create customized crops for your designs.
8. react-colorful
A tiny, dependency-free, fast and accessible color picker component.
9. react-spring
Spring-physics based animation library for React applications.
10. react-tsparticles
Easily create highly customizable particles animations.
11. react-popper
Position tooltips and popovers in an elegant, performant manner.
12. react-pdf-viewer
A PDF viewer made for React.
13. react-i18next
Internationalization for React done right.
14. react-icons
SVG react icons of popular icon packs.
15. audio-player
Music player with custom controls, playlist, filters, and search.
16. image-slider
Image slider component for your pictures.
Writing has always been my passion and it gives me pleasure to help and inspire people. If you have any questions, feel free to reach out!
Connect me on Twitter, LinkedIn and GitHub!
Visit my Blog for more articles like this.
Top comments (62)
cool selection.
i used
react-beautiful-dnd
in the past and probably still in some legacy code somewhere but for new projects, better go with something like github.com/clauderic/dnd-kit.react-beautiful-dnd is no longer maintained
Thank you so much for sharing that. It is a good help ;-)
๐โจ
Thanks for sharing, useful input ๐๐ฏโจ
I have an another package that you would love to add in your list:
React18-input-otp
A fully customizable, one-time password (OTP) and phone number with separator input component for the web built with React. Tested on Web, Android, and iOS. This package supports all react versions.
Thanks for the addition ๐โค๐ฏ
beautiful-dnd is not being actively maintained anymore
Now the hottest lib for this is dnd-kit
Awesome share, thanks a lot ๐โจ๐ฏ
Someone already mentioned react-query, tanstack-table is also amazing - especially if you arent purely working in react. Headless tables - so bring your own framework.
Awesome share ๐๐ฏโจ
Lot of gems listed here!
I thought all sliders/ carousels are kinda deprecated because of accessibility concerns. Was thinking a library like...oh say Redux would be something should at least know of as a react developer...
Thanks a lot for you input ๐โจ๐ฏ
I would also add formik to this list.
Awesome addition, thanks ๐โจ๐ฏ
Great list.
I would add tanstack-query (aka react-query)
Thanks for the addition ๐โจ๐ฏ
I'll replace
image-slider
withSwiper
, but everything else made a good list.Thank you so much, Daniel! ๐๐ฏโจ
Thanks a lot - sharing is caring ๐
So happy you liked it ๐๐๐ฏ
Thanks for sharing these, super helpful!
My pleasure, thanks a lot ๐๐ฏโจ