NetPin

NetPin is an open-source Chrome extension designed to give you complete transparency into the websites you visit. It goes beyond simple network latency checks, providing active privacy protection, real-time technology stack analysis, and genuine sustainability metrics.

Built with a clean interface and integrated dark and light modes, NetPin acts as a lightweight developer and privacy tool wrapped into a single extension.

Key Features

• Privacy Shield (Active Blocking): Rather than just detecting trackers, NetPin actively intercepts known ad networks, analytical spiders, and tracker scripts before they execute in your browser.
• Tech Stack Intelligence: Instantly see what technologies power a website. The extension analyzes the DOM to detect frameworks like React and Vue, CMS platforms like WordPress and Shopify, and CSS libraries like TailwindCSS.
• Geolocation & Journey Mapping: Trace the physical path of your data. You can view accurate server locations on an interactive map based on real IP resolving.
• Sustainability & Carbon: See if the websites you visit are hosted on green infrastructure. NetPin checks for verified green network credentials and carbon offset investments via the Green Web Foundation.
• Domain Intelligence & WHOIS: Quickly access DNS records and WHOIS registrar data to see domain ownership and privacy masking status.

Snapshots

Extension Popup

Dashboard Overview

Connection History

Dashboard About

Installation & Local Setup

To clone this repository and run the extension locally on your own machine, follow these steps:

1. Clone the repository:

   git clone https://github.com/01iamysf/NetPin.git
   cd NetPin

2. Install dependencies: Make sure you have Node.js installed, then run:

   npm install

3. Run the Development Server: If you want to modify the code and see changes instantly with hot-reloading:

   npm run dev

4. Build the Extension for Production: When you are ready to load the extension into Chrome, build the production bundle:

   npm run build

   This will generate a dist folder in the root directory.

5. Load into Chrome:

   • Open your Chromium browser (Chrome, Edge, Brave, etc.) and navigate to chrome://extensions/
   • Enable the Developer mode toggle in the top right corner.
   • Click the Load unpacked button.
   • Select the dist folder that was just generated in your NetPin directory.

How to Use It

1. Visit a Website: Once installed, navigate to any website.
2. Open the Popup: Click the NetPin extension icon in your browser toolbar. If Auto-Analyze is turned off, click "Start Analysis".
3. View the Popup Insights: The popup displays a quick summary, including detected frameworks, active trackers, and server location.
4. Open the Full Dashboard: Click the "Open Full Dashboard" button in the popup to explore the data in depth.
   • Overview Tab: Explore the interactive Server Route Map, examine your connection journey, view detected tech stacks, and review domain WHOIS data.
   • Settings Tab: Toggle your active tracking blocker, switch themes, or configure alert preferences.
   • History Tab: Review a record of recently audited websites, along with their latencies and host data.

Contributing

NetPin is an open-source project and anyone is welcome to contribute.

If you find a bug or run into any issues, please raise an issue in the repository.

If you have a new idea or want to request a feature, feel free to open a discussion or an issue. Pull requests are also always appreciated.

License

This project is open source and available under the MIT License.