React Ecosystem in 2023

As the technology are evolving the tools and library are also evolving. recently the million.js was released that makes react 70% faster. For a beginner it can be quite challenging to chose the correct library.

Here i will list some react libraries which you can learn and become a react developer.

Build tools.

• vite
• nextjs
• Webpack

Routing

• react router
• tanstack router
• if your are using nextjs you don't need a router because it comes with builtin router.

Client State Management

• redux toolkit
• zustand

Server State Management

• tanstack query
• redux-toolkit query
• Apollo Client
• jotai

Form Handling

• Formik
• React Hook Form

Testing

• Vitest
• React Testing library
• Play-write

Styling

• Tailwindcss
• Styled-components
• Emotion
• Bootstrap

UI Components library

• Material UI
• Man time UI
• Ant Design
• Chakra UI
• Headless UI(tailwindcss)
• DaisyUI(Tailwindcss)
• shadcn UI(Tailwindcss)
• React Bootstrap

Animation

• React Spring
• Framer motion

Data Vizualization

• Victory charts
• React Charts js
• Recharts

Table

• Tanstack table

Internationalization (i18n)

• react-i18next
• formatjs

DevTools

• react developer tools
• Redux dev tool
• testing playground
• react hook form dev tools
• AxeDev Tool (Accessibility)
• Tanstack query dev tools

Comments

[Shifa Ur Rehman]

React hook form is miles ahead as compared to Formik. It causes way less overhead than formik.

Same with framermotion vs react spring. Framermotion wins literally everywhere as compared to other animation libs out there.

[GP]

Missing from your list.
Build tools:
Webpack

Styling:
Bootstrap

UI component library:
react-bootstrap

Data Vizualization:
HighCharts (Full accessibility support). Not free though

DevTools:
AxeDev Tool (Accessibility)

[ihtesham510]

thanks for letting community know

[Kerim Karaman]

What do you guys recommend as a backend tech. to learn and works good with React?

[ihtesham510]

use firebase for complete backed service or use nodejs with express and for the database use mongodb

[Rense Bakker]

Pretty good list 👍 I wish you'd add jotai as a state management solution though! And maybe SWR for making requests. SWR works really well with nextjs/Vercel.

[Shubham Battoo]

Tables can also have AG grid (ag-grid.com/react-data-grid/)

[Thiago Braga]

Thanks for this tips

[Kristiyan Velkov]

Good article!

[John Wilson]

Great summary, keep at it !

[Arif Uddin]

There is a typo "Man Time" (Mantine)

[ndotie]

This is cool,
thanks

[Joki_Tenmari]

Thanks you for your posting

[tadashiando]

Concise and super-useful!

[Tiago Rodrigues]

Thanks for the sharing!

[Arif Uddin]

There is a typo "Man TIme" (Mantine)

[Koala]

Very helpful.