Precision Geofencing & Tactical Reminder System
ZoneNotify is a premium, full-stack application designed for high-accuracy location-based reminders. Built with a "Command Center" aesthetic, it leverages PostGIS for centimeter-perfect geofencing and Native Web Push for real-time alerts.
- Immersive Landing Page: Dynamic, full-screen map background that locks onto the user's GPS in real-time.
- Tactical Dashboard: A centralized "Control Center" for creating, monitoring, and deleting geofence zones.
- Precision Geofences: Interactive map selection with a radius slider (10m to 1000m accuracy).
- Native Web Push: Real-time ENTER/EXIT notifications delivered via a background Service Worker.
- Responsive Interface: Optimized for Desktop and Mobile with a specialized split-screen dashboard for operatives on the move.
- Framework: Next.js 15 (App Router)
- Database: PostgreSQL + PostGIS (via Supabase)
- ORM: Prisma
- Styling: Tailwind CSS (Premium Dark Theme/Glassmorphism)
- Animations: Framer Motion
- Maps: Leaflet (CartoDB Dark Matter)
- Notifications: Web Push API + Service Workers
https://zone-notify.vercel.app/
| Landing Page | Dashboard (Monitor) |
|---|---|
|
 |
- Node.js v20+
- PostgreSQL with PostGIS extension enabled.
Create a .env.local file in the root:
DATABASE_URL="your_postgresql_connection_string"
DIRECT_URL="your_direct_connection_string"
JWT_SECRET="your_secure_jwt_secret"
NEXT_PUBLIC_VAPID_PUBLIC_KEY="your_vapid_public_key"
VAPID_PRIVATE_KEY="your_vapid_private_key"
NEXT_PUBLIC_BASE_URL="http://localhost:3000"npx prisma db pushnpm install
npm run devThe system utilizes advanced SQL queries like ST_DistanceSphere to calculate distance between user coordinates and reminder centers on the server-side, ensuring minimal client-side overhead and maximum battery efficiency for mobile devices.
Built for precision. Designed for style.