Coastal cleanup is a project that we have created to bring people together while also supporting wildlife in the ocean. We have created an app that allows users to report trash that they see, and a place where volunteers can meet up and help clean up that trash. We have used Firestore, a NoSQL cloud database by google, to store our information and output it to the volunteers. We have also used React Native with Expo because it allows our app to be on both Android phones as well as iOS phones. Here are our features:
- Pollution report system
- Volunteer page for signing up
How much experience does your group have? Does the project use anything (art, music, starter kits) you didn't create?
All of us have a good amount of experience with what we have worked on, however, none of us have had any react-native experience. Here's a quick rundown of what we have all done and what our experience is.
- Vikram: Designing and creating the main pages. I have lot's of experience in Python and Java, however react.js was a new experience for me so I learned a lot.
- Adikesh: Designing and creating the main pages. I have lot's of experience in HTML and CSS and since react is very similar I was able to get more exposure to technologies that were close to what I already know.
- Arjun: Artwork and design for the project. I've never worked with react-native or anything similar, but I have some experience with Java and I am experienced in computer graphics.
- Sujay: Firestore and popup. I have coded for 3 years and have lot's of experience in databases and servers. I'm also experienced in Python, Java, and Node.JS (from discord bots)
The only things that we didn't create in our project were a few of the icons, the database (firestore), and Expo which is a framework for universal React applications.
What challenges did you encounter?
We encountered many design issues throughout the process such as having a icon be the wrong color because it was overlayed by another box that contained opacity, and a lot of other problems related to placing and centering. However, one of the main issues that we encountered involved the database that we would use. After lot's of time spent researching, we realized that MongoDB, what we originally planned on using, wouldn't work with React Native unless we used the paid version. However, after an hour or two we were able to figure out how to use firebase and eventually integrate it into our code.