Search for a Cocktail Recipe or Ingredient
Learn how to use TheCocktailDB to search for the recipe of a cocktail or ingredient.
We'll cover the following
Let’s assume that we had a great time at a party, and we loved a particular drink served. However, we can’t recall the precise name of the drink. TheCocktailDB API can help us search for the recipe of that drink. Along with a typical search, by using the name functionality, TheCocktailDB API allows searching for drinks using just their initials. This helps users find the recipe of a drink whose name they can’t recall.
Search drink or ingredient
We can search for the recipe of a cocktail or ingredient using the base URI, www.thecocktaildb.com/api/json/v1/1/search.php
.
Request parameters
We can use these query parameters with this endpoint:
Parameters | Type | Category | Description |
| String | Optional | Used to search for the recipe of a cocktail using its name |
| Char | Optional | Used to get a list of cocktails using the first letter of the name of the cocktails |
| String | Optional | Used to search for an ingredient using its name |
Note: We need to use at least one of these parameters with this endpoint. Calling it without any query parameters will return an error.
We use the query parameter, s
, to search for the recipe of a cocktail using its name. The widget below contains the code to search for a cocktail by its name.
const endpointUrl = new URL('https://www.thecocktaildb.com/api/json/v1/1/search.php');const queryParameters = new URLSearchParams({s: 'margarita'});const options = {method: 'GET'};async function searchDrink() {try {endpointUrl.search = queryParameters;const response = await fetch(endpointUrl, options);printResponse(response);}catch (error) {printError(error);}}searchDrink();
Here is a brief explanation of the above code:
Line 1: We define the URL of the endpoint.
Lines 3–9: We define the query parameter and set the appropriate request type.
Lines 11–21: We define the
searchDrink()
function that calls the endpoint and prints the response.Line 23: We call the
searchDrink()
function.
We can replace margarita
in line 4 with the name of other cocktails if we want the recipe for any other cocktail.
We use the query parameter, f
, with the base URL of the search endpoint to get a list of cocktails whose names start with a similar letter. The code below shows how to use this query parameter.
const endpointUrl = new URL('https://www.thecocktaildb.com/api/json/v1/1/search.php');const queryParameters = new URLSearchParams({f: 'a'});const options = {method: 'GET'};async function searchDrinks() {try {endpointUrl.search = queryParameters;const response = await fetch(endpointUrl, options);printResponse(response);}catch (error) {printError(error);}}searchDrinks();
Let’s look at how we’ve modified the code:
- Line 4: We replace
s
withf
. - Line 11: We change the name of the function to
searchDrinks()
.
We can replace a
in line 4 with any other letter to get a different list.
We can also search for an ingredient using its name. To do that, we use the query parameter, i
. The code below shows how to search for an ingredient.
const endpointUrl = new URL('https://www.thecocktaildb.com/api/json/v1/1/search.php');const queryParameters = new URLSearchParams({i: 'vodka'});const options = {method: 'GET'};async function searchIngredient() {try {endpointUrl.search = queryParameters;const response = await fetch(endpointUrl, options);printResponse(response);}catch (error) {printError(error);}}searchIngredient();
Let’s look at how we’ve modified the code:
- Line 4: We replace
f
withi
. - Line 11: We change the name of the function to
searchIngredient()
.
We can replace vodka
in line 4 with any other ingredient we want to search for.
Response fields
The table below contains some important response fields:
Response field | Associated query parameter | Type | Description |
|
| Integer | The API-assigned ID of the drink |
|
| String | The name of the drink retrieved by this endpoint |
|
| String | The category of the drink |
|
| String | The instructions to prepare the drink |
|
| String | A link for the image of the drink |
|
| String | The names of the required ingredients to make the drink |
|
| String | The amount of ingredients required to make the drink |
|
| Integer | The API-assigned ID of the ingredient |
|
| String | The name of the ingredient retrieved by this endpoint |
|
| String | Information about the ingredient |
Note: The value of some of the response objects might be
null
depending on the availability of the data.