added frontend

This commit is contained in:
2025-06-09 18:36:17 +02:00
parent 4719ebee83
commit f04d7b9d1b
7 changed files with 58 additions and 2 deletions

View File

@@ -0,0 +1,4 @@
{
"title": "Pizza",
"recipe": "## Zutaten\n\n### Teig für 3 Pizzen\n\n- **500g** Mehl (Type 405)\n- **250ml** Wasser\n- **21g** Frischhefe (halber Würfel)\n- **10g** Salz\n- **25ml** Olivenöl\n\n### Belag\n\n- Was schmeckt\n\n## Zubereitung\n\n### Teig\n\nAlle Zutaten bis auf das Mehl in eine Schüssel füllen und leicht umrühren.\nDann das Mehl dazuschütten und ca. 5 Minuten mit einem Handrührgerät (Knethaken)\nverkneten. Anschließend noch einmal ca. 10 Minuten per Hand kneten.\n\nDen Teig in einer mit einem feuchten Tuch abgedeckten Schüssel für mindestens 30\nMinuten gehen lassen. Anschließend in 3 gleich große Stücke teilen, noch einmal\nkurz kneten und zu einer Kugel formen. Diese dann in drei kleine Schüssel füllen\nund noch einmal mindestens 60 Minuten gehen lassen.\n\nAbschließend aus den Kugeln mit der Hand runde Pizzaböden formen (nicht mit\nNudelholz!) und nach Belieben belegen.\n\n### Belag\n\nDie Pizza kann belegt werden wie man will. Es lohnt sich, hochwertige Zutaten\nzu verwenden. Außerdem gilt: Weniger ist mehr. Nicht zu dick belegen!\n\n### Backen\n\nHier gilt: Je heißer, desto besser. Im vorgeheizten Ofen bei 300°C Umluft und\nauf einem Pizzastein braucht die Pizza ca. 6-8 Minuten.\nWeder der Pizzastein, noch die 300°C sind unbedingt nötig, aber für das optimale\nErgebnis sollte der Ofen so heiß wie nur irgendwie möglich sein.\n\n### Tipps\n\n- Für einen besonders guten Teig, kann der Teig bereits am Vortag zubereitet\n werden und über Nacht im Kühlschrank gehen. In diesem Fall sollte die\n Hefe-Menge halbiert werden\n- Es ist enorm wichtig, den Teig lange genug zu kneten. Hier darf man auf keinen\n Fall faul sein\n- Den Teig per Hand zu formen erfordert etwas Übung, ist aber relativ schnell\n gelernt. Es lohnt sich, da man mit dem Nudelholz sonst die ganze Luft aus dem\n Teig drückt.\n- Der Pizzateig lässt sich leicht einfrieren. Einfach bereits in runde Form\n bringen, mit Tomatensauce bestreichen und dann einfrieren. Sobald die Pizza\n gefroren ist, in einen Gefrierbeutel packen damit kein Gefrierbrand entsteht."
}

View File

@@ -8,6 +8,16 @@
<script src="addRecipe.js"></script>
</head>
<body>
<div class="addRecipe">
<label for="title">Recipe title:</label>
<input type="text" id="title">
<label for="recipe">Here you can write your recipe:</label>
<textarea name="recipe" placeholder="You can use markdown!" id="recipe"></textarea>
<button id="saveBtn" onclick="saveRecipe()">Save</button>
</div>
<a href="../index.html"><button>Go back to recipes</button></a>
</body>
</html>

View File

@@ -0,0 +1,36 @@
function saveRecipe() {
const title = document.getElementById("title").value;
const recipe = document.getElementById("recipe").value;
if (title && recipe) {
const data = {
title: title,
recipe: recipe,
};
const jsonString = JSON.stringify(data, null, 2);
const blob = new Blob([jsonString], { type: "application/json" });
const url = URL.createObjectURL(blob);
const errorMsg = document.getElementById("errMsg");
if (errorMsg) errorMsg.remove();
const a = document.createElement("a");
a.href = url;
a.download = title;
a.click();
URL.revokeObjectURL(url);
} else if (title === "" || recipe === "") {
throwError("You have to fill in the title and recipe!");
}
}
function throwError(message) {
const element = document.createElement("p");
element.innerText = message;
element.id = "errMsg";
document.body.appendChild(element);
console.error(message);
}

View File

@@ -8,6 +8,9 @@
<link rel="stylesheet" href="style.css">
</head>
<body>
<button onclick="syncRecipes()">Sync recipes</button>
<a href="addRecipe/addRecipe.html"><button>Add recipe</button></a>
<div id="recipes"></div>
</body>
</html>

View File

@@ -0,0 +1,3 @@
function syncRecipes() {
};