• 

  Landing Page

• 

  Loading Page

• 

  Information Page

Totally Not Spying

Inspiration

We click on links every day without thinking twice. But what if I told you that one simple click can expose your location, device info, and browsing habits, often without you even realizing it? I built Totally Not Spying as a fun yet eye-opening experiment to show just how much data websites can collect about you in an instant.

🔍 What It Does

Totally Not Spying is a playful "hacking" simulator that demonstrates how easily your data can be accessed—completely legally. It doesn’t store or steal anything, but it does show you exactly what’s possible using everyday web technologies.

It features:

• 📍 Geolocation tracking (with user consent)
  
• 🌐 IP address detection
  
• 🖥️ Device and browser fingerprinting
  
• 👀 Dramatic “tracking consent” pop-ups
  
• 🖥️ Retro cyberpunk aesthetics with CRT effects, glitch animations, and binary overlays
  
• 🔊 Jump scares & sound effects for extra drama
  

🏗️ How I Built It

This project is powered by:

• React + TypeScript for a smooth, scalable frontend
  
• Vite for fast development and optimized builds
  
• Tailwind CSS for styling without the headache
  
• Lucide React for clean and consistent icons
  
• Web APIs to access real-time user data (with full transparency)
  

🚧 Challenges & Lessons Learned

• Making it fun without being too gimmicky – A basic demo wouldn’t stick with people, so I added effects, sound, and animations to immerse users in the experience.
  
• Balancing realism and ethics – The goal was to raise awareness, not scare people into throwing their laptops out the window. Ensuring transparency was key.
  
• Cross-browser quirks – Different browsers handle permissions in their own way, so I had to tweak how and when data was accessed for a smoother experience.
  

The Takeaway

The internet is a wild place. Websites don’t need malware to gather data about you, most of it is accessible with just a few lines of code. Totally Not Spying is a reminder to think twice before clicking on something sketchy. If it makes even one person more aware of their digital footprint, then mission accomplished.

Check out my code: https://github.com/mchen04/TotallyNotSpying

Built With

• eslint
• geolocation-api
• ip-detection-api
• javascript
• lucide-react
• postcss
• react
• tailwind-css
• typescript
• user-agent-api
• vercel
• vite
• web-audio-api