SightSea

Meet the Team!

Sightseaing Our App

For our HACC challenge we created a marine animal sighting and reporting app (web and mobile) for NIC Hawaii. NIC currently takes reports only through phone, our application allows for easier reports and easier managing of report data. SightSea was built using React, React-Native, Expo, and Firebase. It has two users, a guest and an admin. A reporter can either fill out a form specific to the animal they saw, or call the hotline and report over the phone. Admins require a login and have the ability to see reported data, edit, mark related reports, and also export it as a CSV file. A Google Map API is used for gathering location information and displaying location report data onto the staff page. Some features on the web application are absent on the mobile application due to the differing form factors.

Responsibilities

My responsibilities for SightSea was the front-end and back-end of the reports page. It is important for admins to verify the data of a report before exporting. Admins have the permissions to view the staff page where they are allowed to view a full report after clicking a report on the table, editing the report’s values, and relating reports. Related reports are important for admins to denote which reports referred to the same sighting. Therefore we created a table that showcased related reports to the individual report that was selected. For unverified reports, users can only view and verify, but are not able to edit until the report is verified.

Obstacles

SightSea was the first mobile application for most of us. The two projects we worked on before was built on Meteor and MongoDB, for this application we moved to using Expo for cross platform compatibility and Firebase for our database. Being new to a type of framework had created many obstacles throughout the project. There were setup issues where our React and Node could not be higher than a certain version for certain packages to work and even then we had many warnings. We also had to make many design decisions from Web to Mobile as features such as the map or table was having issues properly porting over. In the end we were able to complete the required features due to great management and overall team support and communication. When there was an issue, we noted it down and discussed solutions, and when someone needed help, we worked together to figure it out.

A Learning Experience

As this was my introduction to mobile development, it was an eye-opening experience working cross platform. Our choice of Expo helped smooth our transition. Besides the bugs, most of our mobile development did not stray far from our web application. Firebase is a NoSQL like Mongo, but it was interesting as querying and manipulating data had a few more steps. We encountered issues on the way but we were also able to overcome them. I believe our team learned a lot building this app, both in teamwork and development. Working with a customer’s guidelines and integrating based on the meetings was a great real work experience. I am thankful for HACC and my team members for this amazing opportunity.