Hawai'i Trails

HawaiiTrails

Try it out!

Hawai’i Trails is a web application / framework to show trails and parks in Hawai’i. The Department of Land & Natural Resources (DLNR) wanted an app / framework that would show official trails in Hawai’i along with information about the trail. They wanted this to be a way to combat tourists and locals from going on hikes that are illegal and which may be unmanaged. They also wanted to display the traffic at a particular trail in hopes that people may see a busy trail and instead decide to pick a less busy one. This is to hopefully help lessen the crowding and damage seen at popular sites. I worked on this with one other group member. We implemented an app that is able to take data about trails and parks and show the location on a map as well as provide additional information.

Implementation

The design of this app was to have the landing page be a map centered on Hawai’i that takes up the whole page, except for a header. We wanted the map to show the outline of trails and parks and highlight them a color according to how busy they are. A legend is provided to help with identifying what the colors mean. Users could click on a trail or park and see a popup with a view button that takes you to a page that gives more information about the site. Information that is shown is amenities, climate, hazards, etc. It also shows a histogram of the amount of visits the place gets per hour per day. We got trail and park data uploaded by DLNR on ArcGIS. We then used an arcgis package to create a map and to incorporate the trail data onto the map. We tried to use the service that was suggested by DLNR for gathering cellphone data to see how busy a place is but that didn’t work out so we instead generated our own sample data to use as a showcase in place of actual data. We also started on an account system so that users could check in at places and leave reviews but we didn’t get that far with reviews. Auth0 was used to handle user accounts and provide authentication and authorization.

Personal Contribution

For this project we decided to try pair programming when possible. We both worked on most of the project together but there were some parts we did separate. For me I did more of the research into packages and libraries to use as well as how we got the data. I worked on some parts in the backend like creating functions to pull data from MongoDB to bring to the client. I made the routes for the api that the client will use to get data. Another part I worked on was adding a histogram that shows the amount of people visiting a location. I also set up the Auth0 login for users to create an account and to be authorized to check in at a place. We both worked on fixing bugs and testing the api endpoints. I didn’t do too much work on the frontend as my partner did more work on that part.

Takeaways

This project gave me a lot more experience working on the backend of an application. I was able to learn how to setup a MongoDB database and interact with it in code. Also learning how to create routes for the client side to talk to the backend which was pretty fun to do. While testing I used an application called Postman to make sure the routes worked and so I wouldn’t need to run the frontend part which helped speed up the development process. Learning how to use Postman I feel is going to be beneficial because I can use it in future projects. I also learned about how to take ArcGIS data and display it on a map using React. I’m not too sure if I will have to do this again but it was good to learn. I also got good experience in pair programming. It can be good to incorporate in group projects because it helps everyone to understand the code. This was important because there were some libraries that we both were new to and so with two people trying to understand how to use it, we got it working faster tahn it would have been solo.

GitHub links:

HACC GitHub

Personal frontend

Personal backend