Our team was inspired by our personal experiences with planning trips to Toronto. When doing so, we felt that the organizational and planning resources accessable to us weren't adequate (which resulted in some of us resorting to scheduling events on Google Docs), so we wanted to create a practical tool that we could use to plan for transit, events, and more.

What it does

DayTrips allows users to select from a list of major cities, view popular attractions, and access maps and distances between locations. Based on the user’s input parameters, DayTrips will provide them with a list of places to visit, distances and a visual representation on the built-in map.

How we built it

JavaScript, CSS (along with bootstrap for extra styling) and HTML is the core and majority of DayTrips. We didn't touch any complex frameworks or libraries such as Angular/React/Vue because it was all our first time creating a web-based application and wanted to keep it simple. Implementing several Google Maps APIs (Maps JavaScript API, Distance Matrix API, etc) allowed us to acquire data needed to display useful information such as location of famous attractions or distance between locations.

Challenges we ran into

  • Not knowing where to start: we spent too much time focusing on smaller details rather than looking at the bigger picture, which lead to us feeling incredibly overwhelmed at first
  • API implementation: we struggled a lot with getting the Google Places API to work, as it was our first time and we were unfamiliar with its usage and how to access the data that we needed to get our application to work

Accomplishments that we're proud of

Creating a functional prototype that incorporates the core of our concept from idea to reality. All members were relatively new to hackathons and its environment, especially the limited time constraints and the sudden software change to web design. Building a functional prototype was one of our biggest goals (after having fun), and we're all very happy that it was accomplishable and completed. Also, all of us barely slept and we're impressed with our ability to function given our sleep-deprived state of mind.

What we learned

  • Creation and design of a functional web app using JavaScript, CSS and HTML
  • Implementation of Google Maps APIs

What's next for DayTrips

As the development of this web-app continues, we hope to implement the following:

  • Global support for adventures in cities around the world
  • Trip history to keep track of previous trips (+ suggest customized future trips based on history)
  • Travel times between locations (with different modes of transportation)
  • Time allocation for each event
  • Offline downloading
Share this project: