Inspiration

Natural disasters kill on average 60,000 people per year around the world (Ritchie & Roser, 2019). But a lot of these deaths could’ve been prevented if people were better informed about the natural events around them. This app that we have created for the Great Uni Hack 2020 aims to help with the provision of this information.

What it does

Our solution is to inform and show the user about past and present events. Our website gives you a visualisation of previous events (including past earthquakes and wildfires) and recent events - tornadoes, volcano activity, wildfires, etc. (provided by the NASA API). It also shows you the Air Quality Index of the city you are currently living in (which is a huge concern - according to the WHO, seven million people die every year due to air pollution). The website can also tell you about other cities, by typing in the name of a city in the search bar, and by displaying recent news about natural disasters from select Twitter feeds and news sources.

How I built it :

On the backend, we used Django and on the frontend, we used Vue.js with the Quasar Framework and Mapbox. The frontend communicates with the backend via REST, getting geojsons and displaying them on the map (the frontend also gets other information such as air quality and events near you).

Challenges

There was a lack of easily available datasets that we wanted to use for the competition.

Accomplishments that I'm proud of

We have a nice visualisation of the geojson data, and integration with many different APIs. We have full integration of Vue.js with Mapbox, with a decent frontend and backend.

What I learned

We learned about working with different geojsons. This was the first project with the Quasar Framework as a component library on the frontend, and the first reasonably large project with mapbox.

What's next for GUH Disaster Prevention

We could add more flooding data and a visualisation of the air quality

Built With

• django
• geojson
• mapbox
• quasar
• vue.js