spa-example/script.js

let btnRandomRecipe = document.getElementById("random-recipe");
let elRecipes = document.getElementById("recipes");

btnRandomRecipe.addEventListener("click", async () => {
	let recipe = await fetch("/api/random-recipe.php", { method: "POST" })
		.then(res => res.json());

	let el = document.createElement("div");
	el.className = "recipe"

	let elName = document.createElement("div");
	elName.className = "recipe-name"
	elName.innerText = recipe.name;
	el.appendChild(elName);

	let elDifficulty = document.createElement("div");
	elDifficulty.className = "recipe-difficulty";
	elDifficulty.innerText = recipe.difficulty;
	el.appendChild(elDifficulty);

	elRecipes.appendChild(el);
});