PHP Academy · Lektion

Eine einfache To-do-Liste erstellen

Erstellen Sie mit PHP und HTML eine einfache To-do-Listen-Anwendung

Eine einfache To-do-Liste erstellen ist eine kostenlose PHP Academy-Lektion auf CoddyKit. Dies ist Lektion 1 von 2. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des PHP Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der PHP Academy-Kurs umfasst insgesamt 2 Lektionen.

Einführung in das To-do-Listenprojekt

Eine einfache To-do-Liste erstellen

Willkommen bei der Lektion über das Erstellen einer einfachen To-do-Liste! In diesem Projekt lernen Sie, wie Sie eine PHP-Anwendung erstellen, mit der Sie Aufgaben hinzufügen, anzeigen und entfernen können. Sehen wir uns das an!

Das Projekt einrichten

Stellen Sie vor dem Start sicher, dass Folgendes vorhanden ist:

Ein Webserver wie XAMPP oder WAMP.
Ein Texteditor oder eine IDE (z. B. VS Code).
Eine Datei mit dem Namen todo.php in Ihrem Projektverzeichnis.

Wichtiger Hinweis: Dieses Projekt verwendet PHP-Sitzungen, um Aufgaben vorübergehend zu speichern.

Die grundlegende HTML-Struktur erstellen

Erstellen Sie zunächst das HTML-Layout für Ihre To-do-Listenanwendung. Beispiel:

Tipp: Verwenden Sie das Element ul, um die Aufgabenliste anzuzeigen.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>To-Do List</title>
</head>
<body>
  <h1>To-Do List</h1>
  <form action="todo.php" method="post">
    <input type="text" name="task" placeholder="Enter a new task" required>
    <button type="submit" name="add">Add Task</button>
  </form>
  <ul>
    <!-- Task list will appear here -->
  </ul>
</body>
</html>

Die PHP-Sitzung starten

Verwenden Sie PHP-Sitzungen, um Aufgaben über mehrere Anfragen hinweg zu speichern. Fügen Sie diesen Code am Anfang Ihrer Datei todo.php ein:

Wichtiger Hinweis: Sitzungen ermöglichen es Ihnen, Daten beim Navigieren zwischen Seiten beizubehalten.

<?php
  session_start();

  if (!isset($_SESSION['tasks'])) {
    $_SESSION['tasks'] = [];
  }
?>

Aufgaben zur Liste hinzufügen

Verarbeiten Sie das Absenden des Formulars, um der Sitzung eine neue Aufgabe hinzuzufügen. Beispiel:

Tipp: Verwenden Sie trim(), um unnötige Leerzeichen aus Benutzereingaben zu entfernen.

<?php
  if (isset($_POST['add'])) {
    $task = trim($_POST['task']);
    if (!empty($task)) {
      $_SESSION['tasks'][] = $task;
    }
  }
?>

Aufgabenliste anzeigen

Verwenden Sie eine Schleife, um die in der Sitzung gespeicherten Aufgaben anzuzeigen. Beispiel:

Wichtiger Punkt: Jede Aufgabe enthält eine Löschtaste, mit der sie aus der Liste entfernt werden kann.

<ul>
  <?php
    if (!empty($_SESSION['tasks'])) {
      foreach ($_SESSION['tasks'] as $key => $task) {
        echo "<li>$task <form style='display:inline;' method='post'><button type='submit' name='delete' value='$key'>Delete</button></form></li>";
      }
    } else {
      echo "<li>No tasks added yet.</li>";
    }
  ?>
</ul>

Eine Aufgabe löschen

Verarbeiten Sie das Absenden der Löschtaste, um Aufgaben zu entfernen. Beispiel:

Tipp: Durch die Neuindizierung bleiben die Aufgabenindizes nach dem Löschen konsistent.

<?php
  if (isset($_POST['delete'])) {
    $key = $_POST['delete'];
    unset($_SESSION['tasks'][$key]);
    $_SESSION['tasks'] = array_values($_SESSION['tasks']); // Re-index the array
  }
?>

Die Anwendung erweitern

Sie können beispielsweise folgende Erweiterungen hinzufügen:

Gestalten Sie die Anwendung mit CSS, um die Benutzeroberfläche zu verbessern.
Verwenden Sie JavaScript, um vor dem Löschen von Aufgaben Bestätigungsdialoge anzuzeigen.
Speichern Sie Aufgaben in einer Datenbank, damit die Daten dauerhaft erhalten bleiben.

Wichtiger Punkt: Erweiterungen machen Ihre Anwendung benutzerfreundlicher und funktionaler.

Gut gemacht!

Herzlichen Glückwunsch! Sie haben mit PHP eine einfache To-do-Listenanwendung erstellt. Sie haben gelernt, wie Sie Sitzungen zum Speichern von Aufgaben verwenden, Formulardaten verarbeiten sowie Aufgaben dynamisch anzeigen und löschen. In der nächsten Lektion erstellen wir ein weiteres unterhaltsames Projekt, um Ihre PHP-Kenntnisse zu vertiefen. Programmieren wir weiter!

Eine einfache To-do-Liste erstellen — Illustration 10

Häufig gestellte Fragen

Ist die Lektion „Eine einfache To-do-Liste erstellen“ kostenlos?

Ja — der vollständige Text von „Eine einfache To-do-Liste erstellen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des PHP Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der PHP Academy-Kurs umfasst insgesamt 2 Lektionen.

Was lerne ich in „Eine einfache To-do-Liste erstellen“?

Erstellen Sie mit PHP und HTML eine einfache To-do-Listen-Anwendung Du übst PHP Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um PHP Academy zu starten?

Keine Vorkenntnisse erforderlich. PHP Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 1 von 2.

Wie lange dauert die Lektion „Eine einfache To-do-Liste erstellen“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser PHP Academy-Lektion Code schreiben und ausführen?

Ja. Jede PHP Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

Eine einfache To-do-Liste erstellen
Ein Kontaktformular erstellen

← Zurück zu PHP Academy