PHP Academy · Урок

Создание простого списка дел

Создайте простое приложение-список дел с помощью PHP и HTML

«Создание простого списка дел» — бесплатный урок PHP Academy на CoddyKit. Это урок 1 из 2. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения PHP Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс PHP Academy содержит 2 уроков всего.

Введение в проект списка задач

Создание простого списка задач

Добро пожаловать на урок по созданию простого списка задач! В этом проекте вы научитесь создавать приложение на PHP для добавления, отображения и удаления задач. Давайте начнём!

Создание простого списка дел — иллюстрация 1

Настройка проекта

Перед началом убедитесь, что у вас есть следующее:

Веб-сервер, например XAMPP или WAMP.
Текстовый редактор или интегрированная среда разработки (например, VS Code).
Файл с именем todo.php в каталоге проекта.

Важный момент: В этом проекте сеансы PHP будут использоваться для временного хранения задач.

Создание базовой структуры HTML

Начните с создания структуры HTML для приложения списка задач. Пример:

Совет: Используйте элемент ul, чтобы отображать список задач.

<!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>

Запуск сеанса PHP

Используйте сеансы PHP, чтобы сохранять задачи между запросами. Добавьте этот код в начало файла todo.php:

Важный момент: Сеансы позволяют сохранять данные при переходе между страницами.

<?php
  session_start();

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

Добавление задач в список

Обработайте отправку формы, чтобы добавить новую задачу в сессию. Пример:

Совет: Используйте trim(), чтобы удалить лишние пробелы из пользовательского ввода.

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

Отображение списка задач

Используйте цикл, чтобы отобразить задачи, сохранённые в сессии. Пример:

Ключевой момент: Каждая задача содержит кнопку удаления, чтобы убрать её из списка.

<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>

Удаление задачи

Обработайте отправку формы с кнопкой удаления, чтобы удалить задачи. Пример:

Совет: Повторная индексация гарантирует сохранение согласованных индексов задач после удаления.

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

Расширение приложения

Вы можете добавить следующие улучшения:

Оформите приложение с помощью CSS, чтобы улучшить пользовательский интерфейс.
Используйте JavaScript для добавления диалоговых окон подтверждения перед удалением задач.
Храните задачи в базе данных для постоянного хранения данных.

Ключевой момент: Улучшения делают приложение более удобным и функциональным.

Отличная работа!

Поздравляем! Вы создали простое приложение списка дел на PHP. Вы научились использовать сессии для хранения задач, обрабатывать данные формы, а также динамически отображать и удалять задачи. На следующем уроке мы создадим ещё один интересный проект, чтобы улучшить ваши навыки работы с PHP. Продолжайте программировать!

Создание простого списка дел — иллюстрация 10

Часто задаваемые вопросы

Урок «Создание простого списка дел» бесплатный?

Да — полный текст урока «Создание простого списка дел» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс PHP Academy, подпишись на CoddyKit PRO. Курс PHP Academy содержит 2 уроков всего.

Чему я научусь в уроке «Создание простого списка дел»?

Создайте простое приложение-список дел с помощью PHP и HTML Ты практикуешь PHP Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать PHP Academy?

Предыдущий опыт не требуется. PHP Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 1 из 2.

Сколько времени занимает урок «Создание простого списка дел»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке PHP Academy?

Да. Каждый урок PHP Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

Создание простого списка дел
Создание контактной формы

← Назад к PHP Academy