My Most Used npm Packages for Frontend Development (July 2025)
This post summarizes the npm packages I often use in my recent private frontend projects.
The focus is on Dependencies only — tools like linters, formatters, and other DevDependencies are intentionally excluded.
Please note that this list reflects the state of things as of July 2025, and will very likely change in the future (actually, it definitely will).
Environment
Here’s the tech stack assumed in this article:
- Next.js
- v15
- React
- v19
- CSS Modules
- TypeScript
- v5
npm Packages
- @bprogress/next
- @clerk/nextjs
- @serwist/next
- @t3-oss/env-nextjs
- next-intl
- next-themes
- nuqs
- use-show-window-size
- usehooks-ts
@bprogress/next
This package adds a progress bar during page transitions in Next.js apps.
With every Next.js upgrade bringing significant changes, it's tough for progress bar libraries to stay up to date. There are many legacy options out there, but this one seems to be the most modern — for now.
That said, it may not work well in combination with some routing/query-related libraries like nuqs. Just treat it as a nice-to-have — it's okay if it doesn't show up, but it's a nice touch when it does.
@clerk/nextjs
This is the official Next.js integration for Clerk, an authentication SaaS.
Clerk has a straightforward API and offers clean separation between dev and prod environments out of the box.
The SDK is pleasant to work with, and using @clerk/localizations makes multilingual support a breeze.
One thing to watch out for: styling uses rem units by default, which may require adjustments depending on your design.
@serwist/next
This package helps with PWA support in Next.js apps.
From what I’ve seen, it seems to be the most popular solution currently.
Setup can be a bit tricky, but the official docs are solid and walk you through it smoothly.
I also recommend pairing it with use-pwa (my own library) and react-ios-pwa-prompt for iOS support.
@t3-oss/env-nextjs
This package lets you treat environment variables in Next.js as typed constants.
When used together with zod, it enforces validation and types at build time — which is great for preventing misconfigured or missing env vars.
It will throw a build error if something is off. Love that.
next-intl
A straightforward and well-documented package for internationalization in Next.js apps.
The documentation is excellent — it even includes examples with Clerk integration, which honestly saved me a lot of trouble. Shout-out to the maintainers!
next-themes
A clean and simple way to add dark mode support to your Next.js app.
No quirks, no surprises — just works as expected.
nuqs
A package that makes query parameters easier to manage in Next.js.
It has a bit of a learning curve and can feel quirky at times, but it's a must-have when dealing with pagination, filtering, or sorting in query strings.
Given that Next.js doesn't offer great built-in handling for typed query params, nuqs fills that gap nicely.
use-show-window-size
This is my own package — a tiny utility that shows the window size in the top-right corner of the screen.
Chrome DevTools now displays this, but I use Firefox most of the time, so this helps me a lot.
usehooks-ts
A collection of useful custom React hooks.
There are other similar packages out there, but I find usehooks-ts to be simple and clean.
My go-to hooks are useBoolean, useLocalStorage, and useWindowSize.
Other Frequently Used Packages
Here are some other packages I often use, though they don’t require much explanation:
That’s it for now.
Lately, I’ve been using the combo of @clerk/nextjs, @serwist/next, @t3-oss/env-nextjs, next-intl, and next-themes in almost all my projects — it’s become my go-to stack.
Some of the implementations are available in my open source projects on GitHub, so feel free to check them out if you’re curious.