Documentation for Project# 2 Assignment by General Assembly
Elixir is a clear, sweet-flavored liquid used for medical purposes, to be taken orally and intended to cure one's illness.When used as a pharmaceutical preparation, an elixir contains at least one active ingredient designed to be taken orally.(source: Wikipedia)
Recipes are sets of instructions that describes how to prepare or make something, especially a dish of prepared food. The term recipe is also used in medicine or in information technology (e.g., user acceptance). A doctor will usually begin a prescription with recipe, Latin for take, usually abbreviated as Rx or the equivalent symbol (℞).(source: Wikipedia)
Mixology is another term for a bartender or bar chef. However, mixology is generally accepted as a refined and in-depth study of the art and craft of mixing drinks. Think of it as the study of the chemistry of drinks, and the mixologist as the professional who studies and practices that.(source: The Spruce Eats)
- Link to the Application
- Link to the Article on Linkedin
- Browser Preview
- Target Audience
- Why I chose this Application?
- History
- The Application
- Instructions
- Hardware Platform
- The Making of the Application
- The API
- Wireframes
- Component Hierarchy
- Previews
- Code Sample
- Features
- User Stories
- Technologies
- Contribution Guidelines
- Bugs
- Fixes
- Attributions
- Special Thanks
- Acknowledgement
- Disclaimer
- Need Help with a Drinking Problem?
- Feedback
Anyone legally old enough to drink legally in their country of residence. Amateur Mixologist and bartenders alike. Drink enthusiast and lovers of relaxation and leisure.
Drinking is a social, recreational and relaxing activity. Most humans on this planet have a relationship with alcohol. I decided to make this application as a tribute to the ritual of alcohol, the different types there are and how we mix it into incredible combinations all around the world. One could say alcohol unites us as a specie. You'll find this application educational, fun and exciting. So have a drink on me!
I made this game as part of my second project assignment for General Assembly coding bootcamp.
Purposeful production of alcoholic drinks is common and often reflects cultural and religious peculiarities as much as geographical and sociological conditions. Discovery of late Stone Age jugs suggest that intentionally fermented beverages existed at least as early as the Neolithic period (c. 10000 BC).(source: Wikipedia)
Elixir: Drink Recipes is a catalog of mixed drinks from all over the world. The API used in this app is populated by all users that are part of this open project.
Upon entry, you are presented with featured drink choices. You can pick one of them or use the search bar to find the drink of your choice based on a few criteria. Once you have chosen your drink, you are shown ingredients and instructions in how to prepare the given drink.
Clone repo, install, cd into folder and run:
npm install
npm start
I have encounter several obstacles while planing and making this app. Functions under JSX and behavior under CSS were the most challenging among the many hurtles that I encounter. For more information please see the "Bugs and Fixes" section.
Is an open, crowd-sourced database of drinks and cocktails from around the world. They offer a free JSON API with no need for a key for application testing.
const ingredients = [];
function getRecipeIngredients() {
let i = 1;
while (recipe['strIngredient' + i]) {
const name = recipe['strMeasure' + i];
const measurement = recipe['strIngredient' + i];
ingredients.push(name + ' ' + measurement);
i++;
}This code help me render 15 different ingredients and measurements in the correct format.
Elixir: Drink Recipes is currently at the Bronze Level features functionality.
-
Bronze/Minimum Viable Product
-
Search input bar
-
Results display after search
-
Link to individual result page
-
Silver
-
Display Random/featured drinks upon entry
-
Search filtered by several categories
-
Display total number of recipes
-
Gold
-
Browse drinks by first letter
-
Mixology news feed added to main page
-
Interactive map to locate liquor stores near by
-
Platinum
-
Social media sharing option
As an adult who loves to relax, perhaps have a drink after a stressful day. I want a way to prepare great drinks and enjoy myself while doing it. Elixir: Drinks Recipe is a great tool to achieve my goal while learning about Mixology.
- HTML
- CSS
- Grid
- Javascript
- JSX
- React
- React Router
- Component Lifecycle Methods
- Application Programming Interface(API)
- Heroku
Submit contribution through my repository for approval through this link: Application Repo
Responsive built for mobile devices does not render correctlyIssue with Heroku repo push"Not Found" result message not centeredIndividual result data for would give error on null valuesSearch results would not stay on page upon returningIssue rendering main logo onto App.js header.
- Used Grid to place results in a dynamic setting
- I deleted the files propmted by the error on the terminal
- Sage Kearny suggested I use grid-column: 2;
- Mindy Marmol helped me create a function that bypassed "null" results and display ingredients and measurements together
- Added componentDidMount and componentDidUpdate to store and callback search result data
- Sage Kearny suggested to move the image from the src folder to the public folder
- API source provided by thecocktaildb.com
- Wireframes were made using wireframe.cc
- Personal branding logo for this file was created using freelogodesign.org
- Online GIF maker used hnet.com
- Image converter to .svg used pngtosvg.com
- Images edited using pixlr.com
- Color scheme maker used coolors.co
- Icon image converter to .ico used icoconvert.com
General Assembly Team: Jared Morgan General Assembly Students: Sage Kearny, Ryan Zimmer, Mindy Marmol
I have been relying on my cohort mates to share the burden and happiness of this amazing learning journey. I have found a new family in them. My family and friends continue to support me and trust that I am capable of finishing the course. Thank you Chris Mendoza for helping me navigate through my times being stuck and pushing me to think for myself and come up with my own answers.
stackoverflow.com, css-tricks.com, github.com, thecocktaildb.com, heroku.com, freecodecamp.org, medium.com, pixlr.com, draw.io, coolors.co, w3.org, w3schools, reactjs.org, iconvert.com, youtube.com, pngtosvg.com, hnet.com, freelogodesign.org, wireframe.cc,
-
Don't drink if you're not of legal age in your country of residence.
-
Never drink and drive.
-
Drinking excessively will cause harm to your body and mind.
-
Always drink responsibly.
Please contact Alcoholics Anonymous for information and links to local A.A. offices and Websites where you can find A.A. meetings or talk to an A.A. member.(source: Alcoholics Anonymous National Website)
Jared Morgan 1:45 PM I’m still seeing a key related error in the console on your deployed app. Just a heads up that you’ll have until Monday to fix any errors and other fixes before we grade.
Dan Fruth suggested to have a default value in the beginning of the page such as my favorite recipe, before putting a random generated option that would change everytime you reload or arrive to the page.