We miss our friends. We miss our campus. We miss our best scenic spots in Vancouver. As we can't physically hang out with our friends due to Covid-19, we have decided to create an interactive map-based application that allows users to share their experience at UBC's most popular spots.

What it does

The application allows users to pinpoint any scenic spot on a map around UBC. Users can either choose to view the gallery contents of that spot created by friends or share their own experience by uploading some pictures taken on site.

How we built it

The web application is built via React with Javascript. Also, Google Maps API is utilized to realize the Map component.

Challenges we ran into

When we were modifying the background images, we ran into a problem that if a single web page's background is modified, the background of other pages will also be influenced. As for front-end development, one of the most difficult things is passing parameters between two web pages.

Accomplishments that we're proud of

We successfully implemented image uploading without running a backend to store it. To accomplish that, we transformed an actual image into strings that could be directly processed by every users' local browser. This is a fast and efficient way to pass massive chunks of data such as images from one page to another.

What we learned

We learned the importance of collaboration and how to work under pressure in such a limited time. Also, we greatly practice our coding skills.

What's next for Exploring UBC - Share your best memory!

First, we are looking forward to adding back-end support for restoring massive data from different users. Secondly, more user interaction functionalities will be supported. Thirdly, we also want to expand our service range, such as the whole Metro Vancouver area.

Share this project: