DEV Community: Pruthvi Darji

Why `npm audit` Isn't Enough to Secure Your React or Next.js App

Pruthvi Darji — Wed, 15 Jul 2026 05:10:02 +0000

If you ship React or Next.js apps, chances are your entire security process is npm audit before a release, maybe a Dependabot badge on the README, and calling it a day.

That covers exactly one category of risk: known CVEs in your dependency tree. It says nothing about the security bugs sitting in your own code — the ones that don't show up in any advisory database because they're specific to how you wrote your app.

What `npm audit` can't see

A few real examples that npm audit will never flag:

An API key or private token hardcoded in a component and committed to the repo
dangerouslySetInnerHTML or eval() used on user-controlled input
A NEXT_PUBLIC_ environment variable that's quietly leaking a secret meant to stay server-side
Non-serializable props crossing a Next.js Server/Client Component boundary (a correctness bug that's also a leakage risk)
window or localStorage accessed outside useEffect, causing hydration mismatches
.map source map files sitting in public/, exposing your original TypeScript source in production
A GPL/AGPL-licensed dependency that quietly puts your commercial product's license at risk
A typosquatted or newly-flagged malicious package that hasn't hit the CVE databases yet

None of this is exotic. Most of it shows up in real production codebases, and none of it is something npm audit was ever designed to catch.

A scanner built for how React/Next.js apps actually break

I built web-secure-verification to cover this gap specifically for React and Next.js projects — not a generic linter, not a CVE database wrapper.

It runs 12 checks in one command:

Check	What it catches
CVE / dependency audit	Known vulnerabilities in installed packages
Outdated / deprecated packages	Packages with safer versions, or ones the maintainer abandoned
Hardcoded secrets	API keys, tokens, private keys, high-entropy strings in source
Code-level security	`eval()`, `innerHTML`, `dangerouslySetInnerHTML`, command injection patterns
Next.js config	Missing security headers, leaked `NEXT_PUBLIC_` secrets, insecure image config
License compliance	GPL/AGPL dependencies that can block commercial use
Supply chain	Typosquatted packages, known-malicious packages, shady `postinstall` scripts
RSC boundary violations	Non-serializable props crossing the server/client boundary
Hydration bugs	`window`/`localStorage` in render, `new Date()` in render
Bundle size	Full `lodash`/`moment` imports, heavy components not lazy-loaded
Exposed source maps	`.map` files leaking original source in public directories

Try it

npm install -D web-secure-verification
npx web-secure-verify scan

You get a color-coded terminal report grouped by severity (Critical → Info), or export it as HTML, JSON, Markdown, or SARIF (for CI/GitHub code scanning):

npx web-secure-verify scan --format sarif --output results.sarif

Where it fits

This isn't a replacement for npm audit, Snyk, or Dependabot — it's meant to run alongside them. Those tools watch your dependency tree; this one watches the code you actually wrote and the Next.js-specific footguns that are easy to miss under deadline pressure.

If you maintain a React or Next.js project, I'd genuinely like feedback — especially on false positives, or checks you think are missing. Repo's here: github.com/pruthvidarji1993/web-secure-verification

Useful Websites for Programmers

Pruthvi Darji — Wed, 31 May 2023 06:20:11 +0000

I have found some of useful websites related programmers

https://www.showwcase.com/
Showwcase is a new social media website, especially for people who code connect, build community. It is a Linkedin like platform but only focused on developers.
https://devdocs.io/
DevDocs brings together numerous API documentation in a single, searchable interface. You will find docs related to various programming languages and technologies in one place.
https://overapi.com/
For all developers, OverAPI is cheat sheets for the majority of programming languages. Take a look at it right now.

Media Processing libraries

Pruthvi Darji — Wed, 31 May 2023 06:10:41 +0000

As a web developer in any technology, media processing and storage are crucial components of your project but now with so many options out there as these sites will provide you with the tools you need to manage and optimise your media files.

Embed.ly: Provides APIs for embedding media in a web page, responsive image scaling, extracting elements from a web page. The free plan allows up to 5000 URLs/month at 15 requests.
Cloudinary: A service for image upload, powerful manipulations, storage & delivery for sites and apps with libraries
Cloudimage: A full image optimisation and CDN service, It offers a variety of image resizing, compression, watermarking functions & open source plugins for responsive image, image making etc...
imgbot: Imgbot is a friendly robot that optimises your images and saves you time, optimised images mean smaller files sizes without sacrificing quality. It uses lossless compression by default.
Transloadit: Handles file upload and encoding of video, audio, images, documents.
Uploadcare: Uploadcare is a media pipeline platform that offers a range of tools for develoers such as file uploading API & UI, Image CDN and origin services with compression
Gofile: Free file sharing and storage platform, can be used via web based UI and also API. unlimited file size, bandwidth, download count etc...

Tailwind Web Components

Pruthvi Darji — Wed, 31 May 2023 06:08:21 +0000

Now a days tailwind CSS trending in any framework/technology specific UI development. I have found some of the best to use a tailwind based component libraries where you can customise the components with tailwind directly.

Daisy UI: Daisy gives you special classes like "btn", "card", etc. These special classes are a combination of other tailwind utility classes.
Flowbite: Flowbite is a free and open-source set of Figma UI components and pages designed to integrate with the utility classes from Tailwind CSS.
WindUI: Like Flowbite but better. This component library does support many framework technology so just copy and paste.
Material Tailwind: Very slick and professional looking component library. Unlike the others component libraries before...

Cool GitHub repositories for self-taught

Pruthvi Darji — Tue, 13 Sep 2022 12:16:33 +0000

A list of programming tutorials in which developers learn how to build an application from scratch.
(https://github.com/practical-tutorials/project-based-learning)

EBooks (https://github.com/EbookFoundation/free-programming-books)

Web Developer RoadMap (https://github.com/kamranahmedse/developer-roadmap)

List of free public APIs for use in Web Development (https://github.com/public-apis/public-apis)

Learn and expand your coding Skills (https://github.com/freeCodeCamp/freeCodeCamp)

Some of the really cool Website especially for improving Javascript Knowledge and code skills

Pruthvi Darji — Tue, 13 Sep 2022 12:11:28 +0000

https://www.jschallenger.com/
(Do code challenges & improve the logic implementation)

https://www.java5cript.com/
(Any thing you can learn about JavaScript & in that you will find the other options like Books, Courses, Videos, Fundamentals specific for JavaScript)

I would say this will help individuals who are working in JS framework OR looking to move in JS

Some of the good Cheat Sheet found on internet

Pruthvi Darji — Tue, 13 Sep 2022 12:08:56 +0000

OverAPI: This cheat sheet for many web programming language such as JS, PHP, Node, CSS etc...
URL: https://overapi.com/

Git Sheet: Each GIT command explains in detail
URL: https://gitsheet.wtf/

Developer Cheat sheet: Contains various cheat sheet like React, ES6 etc...
URL: http://www.developer-cheatsheets.com/

Roadmap Of Javascript

Pruthvi Darji — Tue, 13 Sep 2022 12:07:30 +0000

This road map shows most of the topics related JavaScript, you can also learn one by one each topic by completed the highlighted link and their related lessons.

Road map of JavaScript: https://learnjavascript.online/knowledge-map.html

2022: Best State management libraries in React JS

Pruthvi Darji — Tue, 13 Sep 2022 12:06:05 +0000

As we all know that in react, state management is the way from that we can access the object in entire web & most of the projects and at the time of learning we are using "react-redux" but now we have to use other state management libraries those are more compatible compare to "react-redux"

Zustand: https://zustand-demo.pmnd.rs/
Recoil: https://recoiljs.org/
Hookstate: https://hookstate.js.org/
Redux Toolkit: https://redux-toolkit.js.org/

So now I am expecting from you guys that from the next/new projects we are starting to use new state management libraries...

"Learn continually – there’s always “one more thing” to learn."

Best Animation Libraries specific in React

Pruthvi Darji — Tue, 13 Sep 2022 12:02:46 +0000

Nowadays many frameworks/libraries have come to make you fast in development, according to UI development trending some of the tools are currently frequently used to create isolated components to make development faster.

https://www.framer.com/motion/ (Animation effect)

https://storybook.js.org/docs/react/get-started/introduction (creating components)

Create Local Server and Share anywhere without deploying on any server (live) NGrok

Pruthvi Darji — Tue, 13 Sep 2022 12:01:46 +0000

this is the cool solution like ngrok Secure Tunnels allow you to instantly open access to remote systems, means if you are working in local and if you need to show changes to anyone without any deployment then you can easily do with this..

https://ngrok.com/

You just need to do local installation in system and configuration then you can easily manage (https://ngrok.com/download)

Quick Learning things specific for frontend (javascript & React)

Pruthvi Darji — Tue, 13 Sep 2022 12:00:27 +0000

Webpack Bundle Analyzer: https://www.npmjs.com/package/webpack-bundle-analyzer
Visualise the size of output files with tree-map format.
Micro Front end Architecture: https://micro-frontends.org/
The current trend is to build a feature-rich and powerful browser application
30 Seconds of Code: https://www.30secondsofcode.org/
Short JavaScript code snippets for all your development needs.