Inspiration

We (Jayden Brown and Siam Salam) were reading the prompts and got intrigued by a map of Charlottesville, especially myself (Jayden) who has not really explored too much of what Charlottesville has to offer.

What it does

The web application showcases a interactive map, with markers categorized by color depending on what they mark. Additionally, hovering and clicking on one of the markers provides essential information about said location. Finally, we included two other webpages, which one explains how it works and the other gives more information about ourselves.

How we built it

The main library we used to create the map was Leaflet.js, and then the 3 key web development languages (HTML, CSS, and JavaScript) to provide a front-end. We also used glitch as a live website service to allow others to access and interact with our project.

Challenges we ran into

Given that we were both entirely new to web development, let alone practical programming in general, so it proved difficult to get started and truly let our ideas come into fruition. Additionally, gathering the data for every point marked on the map was extremely tedious yet rewarding.

Accomplishments that we're proud of

As stated previously, we managed to make a website with little to no prior web development knowledge. We are also proud of how the map turned out and how overall sleek the website design is in our opinion.

What we learned

Nothing is as easy as you think, especially developing something outside of your expertise. It takes true patience, effort, and critical thinking to accomplish such a daring feat.

What's next for Wahoo Walkthrough

We have hopes to potentially provide an option to switch between a 2D and 3D map for more interaction. We also want to create a back-end SQL database to store all of our data more effectively and securely.

Share this project:

Updates