commit
764ee5ec06
3 changed files with 42 additions and 0 deletions
+ 8
- 0
api/random-recipe.php
View File
| @@ -0,0 +1,8 @@ | |||
| <?PHP | |||
| $recipe = [ | |||
| "name" => "Whatever", | |||
| "difficulty" => 7, | |||
| ]; | |||
| echo json_encode($recipe); | |||
+ 12
- 0
index.html
View File
| @@ -0,0 +1,12 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <title></title> | |||
| </head> | |||
| <body> | |||
| <button id="random-recipe">Get random recipe</button> | |||
| <div id="recipes"></div> | |||
| <script src="script.js"></script> | |||
| </body> | |||
| </html> | |||
+ 22
- 0
script.js
View File
| @@ -0,0 +1,22 @@ | |||
| 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); | |||
| }); | |||
Loading…