Tidy Town

An app that lets citizens report vandalism and litter to the city.

Comment

Inspiration

We wanted to build community and help keep cities beautiful by allowing people a way to report things they'd like to see cleaned up in their city.

What it does

TidyTown allows citizens to take pictures of littering, graffiti or vandalism that they find unsettling. The picture and problem description is posted to a map where city workers, volunteer groups or good samaritans can find them and clean it up.

How we built it

We built a progressive web app using angular, node and firebase. The app get the user's geolocation using an angular component and then displays it on a map using the google maps api. The user can then take a picture and upload it to firebase. This can all happen offline (the photo is cached and uploaded later when connected to the network) thanks to service workers.

Challenges we ran into

Getting https working

We needed https to get geolocation data, access the user camera and run a service worker so the app can run offline. Obtaining and installing certificates proved to be somewhat difficult within the given time frame. In the end, we moved our entire app onto firebase because they handled https for us.

Learning angular in 24 hours

While we really loved how powerful the angular framework is, 2/3 of our members were new to it, so it took some trial-and-error to get things running

General deployment tinkering

There's a lot that goes in to a running a modern, responsive web app. Simply figuring out how to use the various hosting services (we bounced around between a few) took some love and patience.

Accomplishments that we're proud of

One of our biggest accomplishments by far was how quick our team picked up Angular, taking our initial idea all the way to deployed in under 24 hours!!! We had a lot of fun along the way, learned a lot about what works and what doesn’t, and now have our app fully deployed on Firebase.

We’re also very proud of how well we managed to collaborate, teaching each other new technologies as we found them.

What we learned

We learned a lot about angular syntax and development techniques. Also, deploying an angular application is more complicated than one would think. We learned that dealing with SSL certificates and domain routing in a short time span can be stressful, as they typically take a lot of time to create and update. Finally, after being awake for the last thirty hours, we realized that a good night's sleep is extremely important for one's ability to code.

What's next for Tidy Town

Tidy Town is on its way to be released to the the city of Victoria! (after some tweaks)

Share this project:

Updates