Mapty is a dynamic web application designed to detect your location and allow you to log your running and cycling activities directly on a map! With Mapty, you can interact with a world map, record your workouts, and keep track of your fitness journey, all while enjoying a seamless and intuitive user experience.
- 📍 Location Detection: Automatically detects your current location as soon as you open the app.
- 🗺️ Interactive World Map: Use the map to log activities anywhere in the world. Click on the map to start recording your workout!
- 🏃♂️🚴♀️ Workout Logging: Record your running or cycling activities, including:
- ⏱️ Duration: How long did your workout last?
- 📏 Distance: How far did you go?
- ⚙️ Additional Options: Enter other specific details like cadence for running or elevation gain for cycling.
- 💾 Local Storage: Your logged activities are saved locally on your device, so they are available whenever you return to the app, even after closing your browser.
- 🌐 HTML, CSS, JavaScript: Core technologies for building the structure, style, and interactivity of the application.
- 🗺️ Leaflet: A powerful JavaScript library that enables the interactive map experience in Mapty.
- 💾 Local Storage: A web API that stores your data directly in the browser, ensuring your activities are always saved and easily retrievable.
To get started with Mapty, simply clone the repository and open index.html
in your browser:
git clone https://github.com/your-username/mapty.git
cd mapty
open index.html
When you open Mapty, your location will be detected automatically! 🌍
Click on the map where you completed your workout. Select whether it was a running or cycling session, and fill in the details such as duration and distance.
All logged activities are marked on the map with relevant details. They are saved in local storage, so even if you close the app, your data remains intact.
Implementing Mapty was a challenging journey, involving the integration of location services with the Leaflet map and managing user data persistence with local storage. These complexities required careful planning, debugging, and a deep understanding of web technologies. Despite the challenges, the experience was incredibly rewarding and significantly enhanced my coding skills.
Mapty was created with passion and precision to make tracking your fitness activities fun and easy. I hope you find it as enjoyable to use as it was to create. Happy logging, and thank you for checking out Mapty!