RunTheCity

• 

  welcome hero

• 

  interactive map

• 

  featured rotues

Inspiration

RunTheCity was inspired by the need for athletes and travelers to explore new cities while staying active. I wanted to create a platform that helps users discover running routes in unfamiliar locations.

What it does

RunTheCity allows users to select personalized or featured running routes based on their current location. It also provides step-by-step navigation and tracks user's total distance and time running.

How we built it

I built the app using React with Vite as the frontend framework, integrated Mapbox for map and route rendering, and utilized Tailwind CSS for the styling. I used Node.js and MongoDB for the backend.

Challenges we ran into

I encountered issues with loading the user's location accurately and debugging the directions component. Ensuring seamless route creation and tracking also required fine-tuning.

Accomplishments that we're proud of

I am proud of successfully integrating Mapbox, creating a seamless user experience for route selection, and providing dynamic feedback on the routes chosen by users.

What we learned

I learned how to optimize location-based services in React, manage state more efficiently, and improve debugging strategies for map-related components.

What's next for RunTheCity

I plan to add more cities and landmarks, refine the user interface for a more immersive experience, and incorporate social sharing features to allow users to share their runs with friends.

Built With

• mongodb
• node.js
• react
• vite