js-map-geolocation

Interactive web app that uses the browser’s Geolocation API and Leaflet + OpenStreetMap to display the user’s real-time position on a map, with reverse geocoding for city, country, and nearby address details. Built entirely with vanilla JavaScript - no backend required.

🌍 Location-Based Map

An interactive web app that detects your location, displays it on a Leaflet + OpenStreetMap map, and shows detailed address information (city, country, postal code, etc.) using reverse geocoding.

---

🚀 Features

• 🔹 Real-time location detection using the browser’s Geolocation API
• 🗺️ Interactive map powered by Leaflet.js and OpenStreetMap tiles
• 📍 Reverse geocoding via the Nominatim API to display city, country, and full address
• 🧭 Accuracy indicator showing estimated precision in meters
• ⚡ Pure client-side JavaScript — no backend or API keys required
• 💬 Graceful error handling with retry option
• 🎨 Clean and responsive UI built with vanilla CSS

---

🧰 Technologies Used

• HTML5
• CSS3
• JavaScript (ES6+)
• Leaflet.js
• OpenStreetMap (Nominatim API)

---

🖥️ How to Run Locally

1. Clone this repository

   git clone https://github.com/mad1081/js-map-geolocation.git
   cd js-map-geolocation