Find drinks to make, and utilizes the cocktaildb API to generate recipes for your favorite libations.
Link to project: https://drinklib.mackenziedev.com/
Tech used: HTML, CSS, JavaScript, CocktailDB API
Site utilizes CSS variables for the color theme, flexbox, and a carousel slider effect made via Javascript. Responsive website also utilizes css media queries to adapt to varying devices. Also uses icons from fontAwesome.
DrinkLib could be improved in terms of layout scaling, in my opinion, the scale is too large for usage, and the design and ui could be refactored to allow for easier viewing without a scroll. Also, refactoring the code base to be cleaner, and more efficient, perhaps utilizing OOP principles to abstract more details would be a good optimization for this project.
There were a lot of complications that came up in creating the slider. Preplanning the logic would have been a more efficient way of working on this. This was a great time for me to work with CSS variables, and I gained more experience with them on this project, as well as with complexities that arose during API calls.
Take a look at some other things I've built...
![]() |
![]() |
![]() |
![]() |
|
---|---|---|---|---|
Decycl | Story Crafter | Rock Paper Scissors | Not Too Boring | Etch A Sketch Project |
Connecting businesses with recyclers to bring value to everyone. | Remember your wins & grow your career | Bright, simple challenge VS the computer. | Rainy, hot, cold days won't stop you from having a good time in these cities... | A retro throwback drawing application allows for pixelated sketching |