A List of Useful npm Packages for React Developers

(Originally posted on manindu.dev)

Hi all, this is a list of useful npm packages for React developers. I'm planning to update this frequently by adding more packages. Your suggestions are welcome 😊. Happy coding!!

UI component libraries

1. antd - Ant Design is an enterprise grade UI design system.
2. @material-ui/core - React Material UI components
3. react-bootstrap - Bootstrap 4 components built with React
4. react-bulma-components - React component for Bulma framework
5. semantic-ui-react - A React component library
6. office-ui-fabric-react - The React-based front-end framework for building experiences for Office and Office 365
7. reactstrap - Stateless React Components for Bootstrap 4
8. rebass - React primitive UI components built with styled-system
9. @appbaseio/reactivesearch - React UI components for Elasticsearch

Individual UI components

1. @tippy.js/react - The complete tooltip and popover solution for React apps
2. react-spinners - A collection of loading spinners with React.js based on Halogen
3. react-loader-spinner - react-spinner-loader provides simple React.js spinner component which can be implemented for async wait operation before data load to the view
4. react-spinners-kit - A collection of loading spinners built with styled-components
5. draft-js - Draft.js is a JavaScript rich text editor framework, built for React and backed by an immutable model
6. react-custom-scrollbars - Custom scrollbars for React
7. react-select - The Select control for React
8. react-dropdown - Simple Dropdown component for React, inspired by react-select
9. react-horizontal-scrolling-menu - A horizontal scrolling menu component for React
10. react-collapsible - React responsive collapsible section component
11. react-calendar - Calendar component for React
12. react-datepicker - A simple and reusable Datepicker component for React
13. react-table - react-table is a lightweight, fast and extendable datagrid built for React
14. react-awesome-button - A button component for React
15. react-compound-slider - React Compound Slider is a tiny (4.3kb) slider component with no opinion about markup or styles
16. rheostat - A mobile, tablet, desktop, and accessible slider for the web by Airbnb
17. react-checkbox-tree - A simple and elegant checkbox tree for React
18. recharts - Recharts is a Redefined chart library built with React and D3
19. react-chartjs-2 - React wrapper for Chart.js 2
20. react-vis - A collection of react components to render common data visualization charts
21. victory - React.js components for modular charting and data visualization
22. react-modal - Accessible modal dialog component for React.JS
23. react-responsive-modal - A simple responsive and accessible react modal compatible with React 16 and ready for React 17
24. react-slick - Carousel component built with React. It is a react port of slick carousel
25. react-responsive-carousel - A responsive carousel component for React
26. pure-react-carousel - A highly impartial suite of React components that can be assembled by the consumer to create a responsive and aria compliant carousel with almost no limits on DOM structure or CSS styles
27. react-grid-gallery - Justified image gallery component for React inspired by Google Photos and based upon React Images
28. react-images - A mobile-friendly, highly customizable, carousel component for displaying media in ReactJS
29. react-image-lightbox - A flexible lightbox component for displaying images in a React project
30. react-tabs - An accessible and easy tab component for ReactJS

CSS in JS

1. styled-components - Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress
2. emotion - A CSS in JS library
3. radium - Radium is a set of tools to manage inline styles on React elements. It gives you powerful styling capabilities without CSS

Http clients

1. axios - Promise based HTTP client for the browser and node.js
2. apisauce - An http client built on top of axios
3. request - Request is designed to be the simplest way possible to make http calls. It supports HTTPS and follows redirects by default
4. superagent - Small progressive client-side HTTP request library, and Node.js module with the same API, sporting many high-level HTTP client features

Routing

1. react-router-dom - DOM bindings for React Router
2. universal-router - A simple middleware-style router that can be used in both client-side and server-side applications
3. connected-react-router - A Redux binding for React Router v4 and v5

State management

1. redux - Redux is a predictable state container for JavaScript apps
2. react-redux - Official React bindings for Redux
3. mobx - MobX is a battle tested, simple and scalable state management library transparently applying functional reactive programming (TFRP)
4. redux-saga - redux-saga is a library that aims to make application side effects (i.e. asynchronous things like data fetching and impure things like accessing the browser cache) easier to manage
5. redux-thunk - Thunk middleware for Redux
6. redux-persist - Persist and rehydrate a redux store

Comments

[Salah Eddine Lalami]

Hi @manindu , Thanks for sharing.
here my first post on dev community (support please), please check my new Mernt Starter App built with (Express.js / MongoDB / React / Redux ) + Ant Design ,: dev.to/lalami/mern-app-node-js-rea...

[Chhavimani Choubey]

zustand, new addition to state management and tanstack added many things as well.

[VitoMedlej]

love how there's everything you want for all kind of situations ,Im still a beginner but i feel like I can say ,building websites was never this easy.
Thanks for the List!

[Michael Carr]

trust me, it used to be a lot easier ;)

[Anguram Shanmugam]

awesome recommends!!!

[Alex Awesome]

React implementation of Amazon's jQuery-menu-aim.

github.com/shaggyrec/react-aim-menu

[Lubna Omar]

Great recommends..!
Thank You!