I spent 1 month building my first NPM package from scratch, and here is the result

Victor Francelino — Thu, 26 Mar 2026 19:44:04 +0000

The idea for this project came up when I discovered React Doctor. I really liked their concept and thought about a way to bring this kind of auditing tool outside of the React ecosystem. That's how I created Web Doctor.

Web Doctor is a CLI tool that analyzes HTML, CSS, and JS code, looking for performance improvement opportunities, accessibility enhancements, and critical security issues.

Here are some of the checks Web Doctor currently performs:

Checks the actual file size and format of used images, recommending compression or modern formats (WebP/AVIF).
Verifies if the <body/> contains the minimum required semantic structure (like <header/>, <nav/>, <main/>, and <footer/>).
Warns about the use of deprecated tags and attributes that break accessibility.
Finds empty rules in CSS.
Warns about the use of !important in CSS.
Identifies and alerts about dangerous JS practices, such as the use of eval().

The package is still under active development, and my goal is to turn it into a true static code consulting tool. Here are the next features I plan to implement:

Heading hierarchy checking: To ensure the document doesn't skip logical levels (e.g., jumping from an <h1/> straight to an <h3/>).
Semantic density calculation: To warn when a file has an excess of <div/> tags compared to structural/semantic tags.
Unused CSS detection: Identifying classes declared in the CSS that are not being used in any of the analyzed HTML tags.
Color contrast checking: To ensure text meets WCAG readability standards.

If you have any ideas for new features, or if you just want to share your thoughts and feedback on the project, please let me know in the comments!

NPM Package
GitHub Repo

Forem: Victor Francelino

I spent 1 month building my first NPM package from scratch, and here is the result