KitCreate

• 

  Code to call Gemini and generate a list of supplies for an emergency kit

• 

  Output of prior call, formatted for convenient joining with front-end

Inspiration

Aware of the heightened risk of disasters occurring due to climate change in the US and the disturbingly low number of people who have adequate emergency kits, we decided to take matters into our own hands and innovate a website to assist people.

What it does

KitCreate has a host of features, such as the Kit List, which creates a checklist of items that are typically used in a disaster emergency kit; links to obtain supplies you might not currently have; reminders for when certain supplies expire; and a map of local disaster shelters, in the event of a true natural disaster!

How we built it

For the back-end, we created a function to call Gemini and generate a list of supplies for an emergency kit. We added several facets to the list (in addition to the item’s literal name): a brief description of each item, the quantity required, and its expiration date (if applicable). Later, we linked this function to be displayed with the front-end framework. For the front-end, we designed the interface using HTML and CSS, prioritizing the list and map for the composition of the website. We made it so that generating the list is as easy as clicking a button, with all sorts of information, such as setting reminders and extra information regarding the items showing up second. We integrated a map that tracks your location by using the map openstreetmap.org provides for free.

Challenges we ran into

We ran into a multitude of issues, ranging from things as benign as a missing indent to corrupted files. Our most intense hurdles we overcame were self-learning an entirely new language- React- for our project, one of our team members’ laptops being incapable of installing things as simple as Homebrew, and our code not merging properly when pushed.

Accomplishments that we're proud of

Despite the adversity we endured, we’re most proud of our AI integration and the fact that we were able to self learn Flask and React in such a short period of time. After some initial issues with permissions and API keys, we were able to embed Gemini into our code, from where we could tailor its responses to our exact needs.

What we learned

Our team members all learned new languages, the person writing this specifically learning HTML and CSS, while others learned Flask and React. We also learned to maintain a growth mindset, as patience is the fruit of labor.

What's next for KitCreate

We plan to develop a heatmap of past earthquakes' prevalence and intensity in order to inform the user of their area’s historical-based disaster risk. In addition, we could expand our website into covering other natural disasters, such as wildfires, hurricanes, floods, and the like.

Built With

• adobe-illustrate
• apis
• css
• flask
• gemini
• html
• open-ai
• python
• react.js