Table 27
Inspiration
In light of the recent fires devastating California, we decided to build a site that allowed a convenient method to access air quality measurements while informing users of what they could do to stay safe in the case of an environment with bad air quality.
What it does
This site informs users of the air quality measurements around the various UC campuses. It also offers safety advice for students suffering from bad air quality. The data is displayed in two ways: (1) on a map and (2) on an interactive 'data' page that also tells you about the cause/effect of the air quality.
How we built it
Our website was centered around using the breezometer and Google Maps API. We obtained air pollution data from their webservices and transferred that data into a visual map for users to interact with. We used basic HTML/CSS/Javascript/bootstrap to build our website, using javascript to store all the data that each page needed.
Challenges we ran into
Integrating the different API's lead to a lot of syntax errors :( At one point we even had to start over from scratch because another API from airvisual randomly stopped working. However, with a lot of Googling and a little bit of luck, we managed to finish our website just on time.
Accomplishments that we're proud of
We are mostly proud of getting the website to work- primarily in successfully pulling data from an API all the while lacking a backend. Since our website is mostly data-focused, it was hard to implement it without a database but we managed to successfully make the site.
What we learned
We learned how to take data from APIs, how to code in Git and bootstrap, how to do a variety of CSS animations, how to use JavaScript logic to display data, and frontend code.
What's next for Asepsis
We hope that this site will serve as an informative resource for various UC students! The goal of this website was to display air quality data in a very visual way and to design it so that users could access it quickly.
Log in or sign up for Devpost to join the conversation.