In the past couple of months we have tried to find various rallies to attend in our area, for example Black Lives Matter rallies. However, we found ourselves having to look all over the internet with no organized information of times and locations of these rallies, so we were not able to show our support. This took quite a lot of time, and effort, which was very unnecessary, and as busy high school students we really did not have time for that much planning.
So, when the New Friends, New Voters track was released, it inspired us to take initiative to solve the issues we have faced in the past. We feel that finding an event where you can show support for a cause you love should not be a hassle, but a simple task. However, we decided to not keep it limited to rallies, and add any event which regards politics and activism, to make it more useful for a wide range of audiences.
Thus, we decided to create Activate Local as an easy and organized way to display all events in a user's area regarding politics and social activism.
What it does
Activate Local is a web application where users are able to create, share, or find local events regarding politics and social activism. These events can be rallies, protests, community service, open city hall meetings, venues, such as places to register for voting, speeches given by public speakers, and much more. To navigate around the map, you can search for locations or scroll and move your mouse.
Our web app contains four main features. The first being the map where events are shown so that users can find them and sign up for them. For every event on our map, there is a marker that contains the event name, event type, event description, event date, and event website. This allows users to learn more about events without having to do anything but look around the map! If the user wants to dive deeper they can click on the website link and can sign up for the event or venue and attend.
The second feature is setting up an event so it shows up on the map. If you are an event host, you can set up the event so that a marker will show up on the map displaying the event or venue. However, you do not need to be the organizer, if you have found an event or venue you would like to share you can simply fill out the form as well. Events or venues can be rallies, protests, public speakers, post offices for mail-in voting, register to vote venues, and much more. Anything regarding local activism, politics, and voting! When you create an event it will display text confirming you have created an event, and your event data gets set to our Google Cloud Firebase Real time Database. From here, we grab the data and create a marker on the map displaying your event to everyone! Once the date that you selected for your event has passed, the marker will be removed from the map.
Our next feature is our notification system. Using Radar.io we are able to find a user's area, and if you enter your email to be on our notification list, when a new event is created in your area, you are notified via email. This is huge as users who are busy and don’t have the time to research for events will be able to find events without having to do anything. This saves the hassle which is a reason many people don’t end up attending events.
The last big feature we have is our recommendation system. Our recommendation system takes your inputs of your interests and compares them to events in our Real time Database. It also uses Radar.io to take into account distance, and will display events that are within a certain distance. After your inputs and your area go through our algorithm, we display two events or venues suited just for you.
How we built it
When we first came up with the idea, we didn’t realize how hard it would be. Our first step was to create the base website, however, the backend was extremely grueling. We decided to do all of the front end first, and the backend second. After creating the initial website we implemented the Google Cloud Maps API and created our Google Cloud Firebase Realtime Database. We then created the notification system, create an event form, and lastly, the recommendation form. We needed Radar.io for our setup event form, notification system, and our recommendation algorithm.
We programmed our frontend with HTML, CSS, and JS, and our backend was done with PHP and JS extensively using Google Cloud and Radar.io
The backend for the Google Cloud Realtime Database took the longest time because we were stepping into new territories. Because we wanted to stick to the theme, we decided to try new approaches. We took all of the inputs from the setup event form and the notification form and sent them to our Realtime Database when the user hit submit. For creating events, we then accessed this data from our Google Cloud Database, and every time new data was entered upon hitting submit, we plot a new marker on our Google Cloud Map with all the information the user inputs. Creating an event from a user input was extremely difficult because we had to access the data every time the form was submitted causing data to be added to our database, and we had to geocode the event location from an address to latitude and longitude. To make it more user-friendly we obviously had them enter their address, but when plotting points, the Google Maps API requires latitude and longitude for creating new markers to show an event on the map. In order to do this, we had to geocode the location from a standard address to latitude and longitude using Radar.io, and after extensive research, we were finally able to do so.
For the email notification system we used Radar.io to get the users area and we group the emails based on user area in our database. This allows us to create different emailing lists, and when an event is created in a user’s area, an email is sent to all the users in the area list.
When creating the recommendation algorithm we were stuck at first. However, we realized what we needed to do. We added an “event type” input to the creating an event form, and then we would ask the user to enter their preferred event type. From here we can use Radar.io to compare the user's location to all events with the event type they like, and if it is within a certain distance we display the two closest events which the user would enjoy the most. Lastly, we used Google Cloud to host our website with Firebase.
Challenges we ran into
The challenges came while creating the backend. Learning how to read and write data to and from our Google Cloud database took quite a while, however, Google is great about documentation, and after much debugging we were able to finish all our Google Cloud backend. The next challenge came with Radar.io. Geocoding with Radar.io was hard as none of us had ever done it before. So, we worked through the documentation and went through our code many times causing constant debugging. However, finally, we were able to geocode the address of an event and convert it to latitude and longitude so we could create a marker on the map.
Accomplishments that we're proud of
We are proud of creating a web application that is functional. We were also proud of stepping out of our comfort zones and using Google Cloud and Radar.io extensively. We are proud of being able to stick to the theme as this was 1/2 of our members' second hackathon and create such a nice application. Using Google Cloud and Radar.io the way we did was exceptional and we were actually surprised we were able to pull this off, as the backend was extremely hard. We are also proud of our front-end. This was a beautiful website and given the time constraints, we think it looks great.
What we learned
We learned how to use Google Cloud and Radar.io in our web application. There was so much back-end we needed to learn and it was crazy to think we were able to get it all working. We learned how to incorporate Google Maps into our website as well by creating a pairing algorithm.
What's next for Activate-Local
In our create an event section, we are going to add a verification system which ensures that every event that is added by a user is legitimate. In addition to this, the next step would be to add a feature in which users could sign up for events directly from our website. We also plan on adding code, which will scrape events from all over the internet and automatically add them to the map.