Discover Realtime Location Tracker: An Open-Source PWA for Real-Time Device Monitoring and Communication
Source: Dev.to
Introduction
If you’re into building apps that involve location services, real‑time communication, or IoT‑like tracking, check out Realtime Location Tracker, an open‑source Progressive Web App (PWA) created by Mahmud Rahman (GitHub: mahmud-r-farhan). The app lets you monitor and track connected devices in real time, with interactive maps, instant messaging, and voice calls—useful for fleet management, delivery apps, team coordination, or personal safety tools.
Key Use Cases
- Fleet management and delivery tracking
- Team coordination in the field
- Personal location sharing with friends/family
- Emergency response systems
Standout Features
Real‑Time Tracking
- Continuous GPS updates visualized on a Leaflet map.
- Devices appear as markers with pop‑up details (battery level, platform, connection status).
Device Management
- Automatic device identification, custom icons, and a connection panel to oversee all active users.
Communication Tools
- Live chat powered by WebSockets (Socket.IO) – send messages and click them to zoom to the sender’s location.
- Real‑time audio calls via WebRTC, including a “megaphone” mode for broadcasting to all users.
- Emergency SOS (v4.0+): hold a button to send an alert with GPS coordinates, battery info, IP geolocation, etc. Receivers get audio alarms, vibrations (mobile), and browser notifications.
PWA Capabilities
- Installable, offline support with a fallback page, service‑worker caching, auto‑updates, and push notifications.
Activity Logging
- Server‑side logs for connections, disconnections, and events.
Geofencing & Intelligent Monitoring
- Battery alerts to prevent disconnections.
- Geofencing for location‑based triggers.
Responsive UI
- Dark/light themes, intuitive Floating Action Buttons (FAB), and cross‑device compatibility.
Technology Stack
| Layer | Technology |
|---|---|
| Backend | Node.js (v18+), Express.js |
| Real‑Time Comms | Socket.IO |
| Mapping | Leaflet with OpenStreetMap (offline maps supported) |
| Audio | WebRTC (peer‑to‑peer) |
| Frontend | HTML, CSS, JavaScript, EJS templates |
| PWA Essentials | Web App Manifest, Service Worker |
| Deployment | Docker, Docker Compose |
| Tooling | npm, Git, GitHub Actions |
The project uses vanilla JavaScript with targeted libraries, keeping it lightweight and easy to extend.
Setup Guide
Clone the repository
git clone https://github.com/mahmud-r-farhan/Realtime-Location-Tracker.git
cd Realtime-Location-Tracker
Install dependencies
npm install
Run the app locally
npm start
Open http://localhost:3007 in your browser, grant location permissions, and start tracking.
Production with Docker
docker build -t realtime-location-tracker .
docker run -p 3007:3007 realtime-location-tracker
Or use Docker Compose:
docker-compose up -d
Testing Real‑Time Features
Open the app in multiple browsers or devices, invite others to join, grant location access, and watch the updates appear on the map.
Demo & Resources
- Live demo: (best experienced with multiple users)
- Demo video: Watch the Demo (link from Mahmud’s LinkedIn post)
- Screenshots: located in the repository’s
public/assets/folder
Contributing
The project is licensed to encourage collaboration. To contribute:
- Review
CONTRIBUTING.mdfor guidelines. - Follow the
CODE_OF_CONDUCT.md. - Report security issues via
SECURITY.md. - Submit pull requests with tests and alignment to the core stack.
Conclusion
Realtime Location Tracker showcases how open‑source can drive innovation in tracking and communication technologies. It offers a solid foundation for learning about WebSockets, WebRTC, PWAs, and location‑based apps, while also providing real‑world potential for customization (e.g., geofencing, IoT integration).
If you’re interested, star the repo on GitHub: , fork it, and start building!