-
A Post viewed from the pin
-
New Post
-
The Map
What was our inspiration?
This idea came to us last week when the garbage truck missed our whole street. We were frustrated, however, nobody called the City because we did not want to go through the trouble of getting in contact with the city via phone. So, for this hackathon, we decided to create a web application that could display the issues people have to the city council.
What it does?
This web application allows the user to view the map with a layer of pins displaying all of the issues people in their communities have! The more issues there are in a certain area, the higher the number of clusters increase, and the more severe areas have red clusters. If the user wants to add their own issue, they can simply press the new post button and go to a menu where they can fill out their name, issue, and upload a quick picture. This updates on the map instantly.
How we built it?
We used node.js to make this whole web application, and all the data was stored on a database called Firebase. We made 2 webpages , one for the Map, and one for a New Post. We make the New Post page upload and add onto the present database with their name, description of problem, location (latitude and longitude), and the image. Then, the map reads the data off the database and shows all the pins on the map.
Challenges we ran into?
The major challenges we ran into was reading and writing to the database. It was very picky with its syntax and the way the data was read/written. However, after hours and hours of researching we were able to learn the skills needed to program and set the database up accordingly. Another challenge we ran into was deciding which platform to make it on, we first decided to use React Native for our development without having any experience developing with it before and we very quickly ran into many obstacles. So then, we switched to a node.js which was a platform we had a little knowledge about. However, because of our expertise with java, we were easily able to grasp the skills needed to create this web application.
Accomplishments that we're proud of
We are very proud that we got the database to work with our code. It took us over 6 hours to properly set it up and when it worked we were overwhelmed with excitement! We are also pretty proud of the web application itself because it was the first web application we have ever made and it actually turned out really nice!
What we learned
We actually learned a lot of about web application development during our venture. This was a clear case of learning by doing, and we are pretty proud of that. I (Samandeep) only heard about node.js and last night I blindly started making a node.js web application. We learned crucial things about how a web application interfaces with a database and how they work together to make a seamlessly fluid application!
What's next for Mapped Ideas
Our goals for this application is to make it into a mobile application available on both App Store and Google Play Store! We want it to make it super easy for the user to use this application and what's easier than an app. We also want to implement a register and login page for users so they can track their issues and see if the city is doing anything about it!
Log in or sign up for Devpost to join the conversation.