Spot Alert: Building a real time accidental zone alerting system

Overview

Spot Alert is an incident reporting system built for two audiences: citizens who report problems, and authorities who respond to them. A citizen spots a road hazard, a broken street light, or a public safety issue. They open Spot Alert, file a report in under a minute, and move on. On the other end, a verified admin sees that report come in, reviews it, and updates its status. We built the full system across three components: the citizen-facing app, the Spring Boot backend, and the admin dashboard for authorities.

The Problem

In most cities, reporting a civic issue means calling a helpline, filling a paper form, or emailing an office that may not respond for days. There's no feedback loop. The person who filed the complaint usually has no way of knowing whether anyone looked at it.

Spot Alert addresses that by creating a two-sided system: one interface for reporting, one for responding, connected by a shared backend with a clear status trail.

What We Built

The system has three independent parts.

The citizen frontend is a React app where anyone can file an incident report. Fill in the details, submit, and get a reference. No unnecessary onboarding, no form fields that don't apply to a street-level incident.

The backend is Java 17 and Spring Boot, secured with Spring Security. It handles authentication, the incident lifecycle — reported, verified, resolved — and exposes REST APIs for both client apps. The backend runs in a Docker container. The admin panel is a React and TypeScript dashboard built with Vite and Tailwind CSS. It is the authority-side interface: see all incoming reports, filter by status, drill into details, and update incident state. This was the component I owned end to end.

Architecture

The project is split across three repositories by design. The backend, citizen frontend, and admin panel each deploy independently. This mirrors how a real government deployment works: the citizen app and the admin panel are accessed by different people on different networks, and neither should need to change when the other does.

Separate repos also meant two developers could work in parallel without interfering with each other's code.

Backend: Spring Boot and Spring Security

Authentication and authorization are handled by Spring Security. User and admin roles are defined at the API level — the backend enforces access control regardless of what any frontend does. Admin-only endpoints return 403 to unauthenticated or under-privileged callers.

Incidents move through three states: reported, verified, and resolved. Every status change is tied to the user who made it. The database schema covers users, incidents, and status history.

User Frontend

The citizen app keeps the reporting flow as short as possible. No account is required to file a report — describe the incident and submit. Registered users can check the current status of their past submissions.

Admin Panel

This was my primary contribution. The admin panel is role-gated: only verified admin accounts can access it. On login, the dashboard loads all incoming reports sorted by recency. Admins can filter by status, review individual incidents in detail, and move them through the workflow with a status note.

The panel is built in TypeScript for type safety across the component tree, Tailwind for layout and styling, and shadcn/ui for the interface components. Vitest covers unit testing.

The result is a single view where authorities can see what has been reported, what is under review, and what has been resolved — without switching between spreadsheets, inboxes, or phone logs.

Role-Based Access Control

Citizens can file reports and view their own submissions. They cannot see other users' reports or reach any admin interface.

Admins can see all reports, update statuses, and manage the dashboard. Admin accounts are created at the backend level. There is no self-registration path to admin access. Authorization is enforced at the API. The frontend gating is a UX layer, not a security boundary.

Tech Stack

1. Backend: Java 17, Spring Boot, Spring Security, MySQL, Docker
2. User Frontend: React, JavaScript, HTML, CSS
3. Admin Panel: React, TypeScript, Vite, Tailwind CSS, shadcn/ui, Vitest

Delivery

Shipped in 3 weeks across a two-person team. Week one covered the database schema, Spring Boot setup, and core REST APIs. Week two was the citizen frontend and backend integration. Week three was the admin panel and end-to-end testing across all three components.

Traction

Spot Alert was presented to local government stakeholders and academic reviewers as a working civic tech prototype. It was evaluated positively as a practical tool for municipal incident tracking — a step up from the phone-and-spreadsheet workflows still common in most local administration offices.