Readme angepasst, Leserlichkeit im Code leicht verbessert

react-unterricht-todolist/src/App.jsx

@@ -15,6 +15,7 @@ function App() {
         };
         setTodos((currentTodos) => [newTodo, ...currentTodos]);
     }
+
     function toggleTodo(id) {
         setTodos((currentTodos) =>
             currentTodos.map((todo) =>
@@ -22,6 +23,7 @@ function App() {
             )
         );
     }
+
     function deleteTodo(id) {
         setTodos((currentTodos) =>
             currentTodos.filter((todo) => todo.id !== id)

react-unterricht-todolist/src/components/TodoForm.jsx

@@ -1,22 +1,30 @@
 import { useState } from "react";
+
 function TodoForm({ onAddTodo }) {
     const [input, setInput] = useState("");
     const [priority, setPriority] = useState("normal");
     const [validationError, setValidationError] = useState("");
+
     function handleSubmit(event) {
+
         event.preventDefault();
         const cleanedInput = input.trim();
+
         if (cleanedInput === "") {
             setValidationError("Bitte geben Sie eine Aufgabe ein.");
             return;
         }
+
         onAddTodo(cleanedInput, priority);
+
         setInput("");
         setPriority("normal");
         setValidationError("");
     }
+
     return (
         <form className="todo-form" onSubmit={handleSubmit}>
+
             <div className="form-field">
                 <label htmlFor="todo-input">Neue Aufgabe</label>
                 <input
@@ -27,6 +35,7 @@ function TodoForm({ onAddTodo }) {
                     placeholder="Zum Beispiel: React-Komponenten wiederholen"
                 />
             </div>
+
             <div className="form-field">
                 <label htmlFor="priority">Priorität</label>
                 <select
@@ -39,6 +48,7 @@ function TodoForm({ onAddTodo }) {
                     <option value="high">Hoch</option>
                 </select>
             </div>
+
             <button className="primary-button" type="submit">
                 Aufgabe hinzufügen
             </button>