Safe spot

Inspiration

SafeSpot Map is a web application designed to enhance public safety in urban areas by allowing users to report and view safety incidents in real-time on an interactive map. Built with React and Tailwind CSS, it leverages React Leaflet to visualize incidents geographically, empowering communities and local authorities to respond faster and more effectively. This project aims to foster safer cities by promoting transparency, awareness, and timely information sharing.

What it does

SafeSpot Map allows users to report public safety incidents and view them on an interactive map in real-time. It helps communities stay informed and encourages quicker response to urban safety issues.

How we built it

We used React for the frontend, Tailwind CSS for styling, and React Leaflet to display location-based incident data on the map. Data is managed locally for simplicity, with plans to integrate backend storage later.

Challenges we ran into

Integrating React Leaflet and managing dynamic markers with user inputs was tricky. Ensuring a smooth user experience with responsive map updates took some trial and error.

Accomplishments that we're proud of

We built a fully functional, responsive map app with incident reporting in under a few hours, demonstrating a solid integration of mapping and UI frameworks.

What we learned

We gained practical experience combining React with mapping libraries and learned how to manage state for location-based data effectively.

What's next for Safe spot

Adding backend support for persistent incident storage, user authentication, and real-time notifications to enhance the platform’s reliability and scalability

Built With

• frontend
• javascript
• react
• tailwind