Skip to content

emiedonmokumo/gitview

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

👁️ GitHub Profile View Tracker

A lightweight Express.js + MongoDB service that tracks and displays the number of visitors to your GitHub profile via an embeddable SVG badge. When someone loads your GitHub profile README containing the badge, the service logs the view and updates the counter in real-time.

Demo Video

🚀 Features

  • 📊 View Counting — Tracks total profile views per GitHub username.
  • 🌍 Geo Detection — Identifies visitor country using geoip-lite.
  • 🕵️ Smart Filtering — Detects and logs only requests coming from GitHub’s CDN or profile pages.
  • 🖼️ SVG Badge — Returns a live, cache-free image showing the view count.
  • 💾 MongoDB Storage — Saves all visits for analytics and stats.
  • ⚙️ Environment Config — Securely loads settings (DB URI) from .env.

🧠 How It Works

  1. Each time someone loads your profile README, GitHub fetches your badge from the /api/track endpoint.
  2. The server checks if the request came from GitHub (via headers and user-agent).
  3. If valid, it logs the visitor’s IP (and country if possible) to MongoDB.
  4. The endpoint then returns an SVG image showing your total views.

🧩 Example Usage

Add one of these to your GitHub profile README.md:

![Profile Views](https://gitview-eta.vercel.app/api/track?username=YOUR_GITHUB_USERNAME&v=1)
![Profile Views](https://gitview-eta.vercel.app/api/track?username=YOUR_GITHUB_USERNAME&v=2)
![Profile Views](https://gitview-eta.vercel.app/api/track?username=YOUR_GITHUB_USERNAME&v=3)

🛠️ Setup Guide

Follow these steps to run the GitHub Profile View Tracker locally or on a hosting platform like Vercel, Render, or Railway.


1. 📦 Clone the Repository

git clone https://github.com/emiedonmokumo/gitview.git
cd gitview

2. 📝 Install Dependencies

npm install

or

yarn install

3. 🌐 Set Up MongoDB

  • Create a free MongoDB cluster at MongoDB Atlas.
  • Get your connection string (URI) and replace <password> with your database user password.
  • Create a database named gitview and a collection named views.

4. 🔧 Configure Environment Variables

  • Create a .env file in the root directory.
  • Add your MongoDB URI:
    MONGODB_URI=your_mongodb_connection_string
    

5. 🚀 Run the Server

npm start

or

yarn start

About

A GitHub profile visitor tracking service using tracking pixels or badges

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published