What Are Your Must-Have NPM Packages for Modern React Projects in 2025?

[manukumar7]

Select Topic Area

General

Body

I’m especially curious about libraries you use for state management, forms, animations, data fetching, and performance. If you’ve replaced older tools (like Redux or Formik), I’d love to hear your updated stack!

[ebndev]

Hi @shubham055555, thanks for participating in GitHub Discussions!

Please note: we’ve clarified our stance on using generative AI tools like ChatGPT within our Community via this announcement. Please review the guidelines to ensure your post meets them as failure to adhere to those rules can result in action taken by our moderator team. 

You can read our updated Code of Conduct and the announcement for more details.

Please feel encouraged to continue engaging in Discussions as your authentic self though. We appreciate you being a part of the Community 🌟

[ebndev]

Hi @dasundu, thanks for participating in GitHub Discussions!

Please note: we’ve clarified our stance on using generative AI tools like ChatGPT within our Community via this announcement. Please review the guidelines to ensure your post meets them as failure to adhere to those rules can result in action taken by our moderator team. 

You can read our updated Code of Conduct and the announcement for more details.

Please feel encouraged to continue engaging in Discussions as your authentic self though. We appreciate you being a part of the Community 🌟

[Chanirulk]

I would say must-Have NPM Packages for React are, at least the ones I use for most of my projects:

• react-router-dom – Modern routing with nested routes and data APIs
• zustand or jotai – Lightweight, simple state management
• @tanstack/react-query – Powerful server-state handling and caching
• tailwindcss – Utility-first styling, fast and flexible
• shadcn/ui – Ready-made, accessible components built on Tailwind
• framer-motion – Smooth animations and transitions
• react-hook-form – Performant and easy form handling
• zod or yup – Schema-based validation, great with TypeScript
• eslint + prettier + husky – Code quality and formatting automation
• vite or next.js – Blazing-fast dev experience and SSR support
• vitest + react-testing-library + cypress – Modern testing stack
• lucide or react-icons – Scalable vector icons
• react-i18next – Reliable internationalization
• dotenv – Environment variable management

[Malindup2]

🌐 Routing: react-router-dom (nested routes + data APIs)
🔄 State: zustand / jotai (RIP Redux)
📡 Data: @tanstack/react-query (caching god)
🎨 CSS: tailwindcss + shadcn/ui (speed + RAD)
✨ Animations: framer-motion (buttery moves)
📝 Forms: react-hook-form + zod (TypeScript bliss)
🧹 Hygiene: eslint + prettier + husky (no garbage commits)
⚡ Bundler: vite / next.js (SSR if needed)
🧪 Tests: vitest + RTL + cypress (full coverage)
🔤 i18n: react-i18next (no reinventing wheels)
🔐 Secrets: dotenv (keep keys safe)

[rajkhatri398]

If you're building a new React project today, here's what I'd recommend based on current best practices :

State Management :
Zustand has become my go-to for client state. It’s like Redux without the boilerplate—simple hooks API and tiny bundle size.
For finer-grained state, Jotai (atomic state) works beautifully.
TanStack Query (formerly React Query) handles server state and caching better than anything else. It’s eliminated most of my Redux usage.

Forms :
React Hook Form + Zod is the dream team. Fast, type-safe, and way lighter than Formik. Zod’s validation integrates perfectly with TypeScript.

Animations :
Framer Motion still dominates for complex animations and gestures.
For simple stuff, AutoAnimate is magic—just wrap a component and it animates changes automatically.

Data Fetching :
TanStack Query does 90% of what I used Axios + Redux for (caching, retries, mutations).
If you need GraphQL, Apollo Client or Urql are solid.

Performance
Next.js App Router (with React Server Components) is the future. Built-in optimizations like streaming and partial hydration make a huge difference.
The new React Compiler (when stable) will auto-memoize, reducing manual useMemo/useCallback needs.

Utilities
Zod for validation (I’ve replaced Yup entirely).
Tailwind CSS + CSS variables for styling—faster runtime than CSS-in-JS.

What I’ve Replaced
Redux → Zustand/Jotai (unless you need Redux Toolkit’s middleware).
Formik → React Hook Form (7x faster renders, simpler API).
Axios → TanStack Query/SWR (smarter caching, less code).

[hamzakargin]

For state management, I still prefer Redux — in my opinion, it’s the most powerful and scalable solution for React apps. I’ve tried other tools, but nothing beats the clarity and control Redux gives, especially with Redux Toolkit.

For forms, I switched from Formik to React Hook Form — much lighter and better in terms of performance.

For animations, Framer Motion is the best balance of power and simplicity.

For data fetching, I usually go with RTK Query (when using Redux) or React Query, depending on the project size.

[ebndev]

Hi @mmycin, thanks for participating in GitHub Discussions!

Please note: we’ve clarified our stance on using generative AI tools like ChatGPT within our Community via this announcement. Please review the guidelines to ensure your post meets them as failure to adhere to those rules can result in action taken by our moderator team. 

You can read our updated Code of Conduct and the announcement for more details.

Please feel encouraged to continue engaging in Discussions as your authentic self though. We appreciate you being a part of the Community 🌟

[Suprotik007]

Daisy ui , tailwind css, react-router, firebase, jwt, axios

[judeotine]

Hey everyone, here’s what I’ve been using lately for modern React projects and it’s been working really well for me in 2025
For state management, I’ve mostly switched to Zustand because it’s so lightweight and easy to set up or Jotai if I need something more granular. I don’t really use Redux anymore. it just feels like overkill for most apps now.
When it comes to forms, I dropped Formik a while back and now I use React Hook Form almost exclusively. It’s faster, simpler and works great with validation libraries like Zod.
For data fetching, I rely on TanStack Query (used to be React Query). It’s perfect for handling caching, pagination and real-time updates. If I want something lighter, I sometimes go for SWR.
On the animation side, Framer Motion is still my go-to. It makes creating smooth animations super straightforward.

For performance, I use React Virtual for long lists. it’s been a lifesaver for tables and feeds and react-fast-compare when I need precise memoization. I also include clsx in almost every project for cleaner conditional classNames.

Some other packages I keep in my toolbox are:
lodash-es for utility functions without bloating the bundle, dayjs or date-fns for date manipulation, react-helmet-async for managing SEO tags, especially on SSR apps.

So basically, compared to a few years ago, I’ve replaced things like Redux with Zustand or Jotai, and Formik with React Hook Form. It’s made my workflow a lot smoother and my code easier to maintain.

Curious to hear what packages others are loving these days!

[theianmay]

Hey! For state management, I’d suggest Zustand — it’s lightweight and easy to work with.
For forms, React Hook Form is a great alternative to Formik.
For animations, look into Reanimated or Moti for a smoother experience.
React Query is solid for data fetching, and FlashList is worth considering for better performance with large lists.

Overall, these tools offer a more modern, streamlined approach than some of the older libraries.

[jaynortheastern]

@manukumar07

The front-end world moves fast, and the tools we use are constantly evolving. Here’s a look at a modern, updated stack for 2025, focusing on performance and a great developer experience. This stack replaces some of the older mainstays with more modern, efficient, and often simpler alternatives.

The Modernized 2025 Frontend Stack

Here’s a high-level overview of the recommended libraries and tools:

Category	Recommended Tool	Replaces (Older Tool)
State Management	Zustand or Jotai	Redux
Forms	React Hook Form	Formik, Redux Form
Animations	Framer Motion	React-Spring, CSS Animations
Data Fetching	TanStack Query (React Query)	Redux Thunk, Sagas, useEffect
Performance	Next.js or Vite	Create React App

[rahul-1729]

@manukumar07
I like keeping things simple

1. axios
2. dotenv
3. redux
4. zod
5. tailwind css

[KhairulHasanRakib]

Must-Have NPM Packages for Modern React Projects in 2025

1. react-router-dom: Routing.
2. zustand: State management.
3. @tanstack/react-query: Server-state management.
4. tailwindcss: Utility-first CSS framework.
5. shadcn/ui: Accessible UI components.
6. framer-motion: Animations.
7. react-hook-form: Form management.
8. zod/yup: Validation libraries.
9. eslint + prettier + husky: Code quality tools.
10. vite/next.js: Fast builds or SSR.

@manukumar07

[Y-Shivansh]

Select Topic Area

General

Body

I would say - bcrypt, express, cors, dotenv, mongoose (or other sql, whatever you are using), zod (or joi), jsonwebtoken, nodemon

for frontend

• (npm create vite@latest (if using vite)), axios, react-router-dom, react-toastify (makes work a bit easy)

[redradman]

• Next.js - React framework with App Router, SSR, and built-in optimizations
• TypeScript - Type safety and better developer experience
• Tailwind CSS - Utility-first CSS framework for rapid styling
• shadcn/ui - Copy-paste component library built on Radix UI
• Lucide React - Beautiful, consistent icon library
• Zustand - Lightweight state management with minimal boilerplate
• TanStack Query - Server state management with caching and mutations
• React Hook Form - Performant forms with minimal re-renders
• Zod - Runtime schema validation for forms and APIs
• Motion - Declarative animations and gestures
• Prisma - Type-safe database ORM with great DX
• NextAuth.js - Authentication for Next.js applications
• Vercel - Deployment platform optimized for Next.js
• ESLint - Code linting with recommended React/Next.js rules
• Prettier - Code formatting for consistent style
• Husky - Git hooks for pre-commit linting and formatting
• TypeScript ESLint - TypeScript-specific linting rules
• Tailwind Prettier Plugin - Auto-sorts Tailwind classes
• React DevTools - Browser extension for debugging React
• Plop - Code generator for consistent component scaffolding
• clsx - Utility for conditionally joining classNames
• date-fns - Modern JavaScript date utility library
• React Error Boundary - Graceful error handling in components

[github-actions[bot]]

🕒 Discussion Activity Reminder 🕒

This Discussion has been labeled as dormant by an automated system for having no activity in the last 60 days. Please consider one the following actions:

1️⃣ Close as Out of Date: If the topic is no longer relevant, close the Discussion as out of date at the bottom of the page.

2️⃣ Provide More Information: Share additional details or context — or let the community know if you've found a solution on your own.

3️⃣ Mark a Reply as Answer: If your question has been answered by a reply, mark the most helpful reply as the solution.

Note: This dormant notification will only apply to Discussions with the Question label. To learn more, see our recent announcement.

Thank you for helping bring this Discussion to a resolution! 💬