Inspiration

Making cocktails is fun, but how do you know what ingredients to use, what glass to put it in, and whether to shake or stir? You have to search the internet for every new cocktail you want to make. That's no good. Why isn't there a one stop shop for all your cocktail recipe needs? Well now there is!

What it does

Drink Ninja is a comprehensive database of cocktails with instructions on how to make them, what garnishes to use, what glass to pour it in, and how much of each ingredient to measure out. You can also search for cocktails by ingredient to see what you can make with the items in your pantry! T

How we built it

We used a Python script to scrape all the cocktails on Wikipedia. After cleaning this data, we designed a website using Figma and the built it out with React.

Challenges we ran into

Having a clean looking website with some visual flair was important to us. No other cocktail website is like this. So we spent a lot of time tweaking the visuals to be just right. This meant hours of battling with CSS to get something trivial like a drop shadow to look just how we wanted it.

Cleaning the data was also a challenge because Wikipedia does not have cocktails formatted in a consistent way.

Accomplishments that we're proud of

We are proud of the design of our site. Each drink has its own custom illustration with the proper glass, ice, and garnishes. Each drink also has its own font and border theme, and a custom color, background color and accent color. We think these visual elements add a unique experience to our site that no other existing cocktail website can match.

What we learned

We learned about many new types of cocktails like "Death in the Afternoon." Pour one jigger absinthe into a Champagne glass. Add iced Champagne until it attains the proper opalescent milkiness. Drink three to five of these slowly.

What's next for Drink Ninja

We want to add filter and sort options to our search bar. We also want to add links to each ingredient. So, for example, if you click on "Vodka" it will filter for all the cocktails with vodka in it. We also want to add a ABV field for each drink.

Share this project:

Updates