Building a Simple To-Do List
Create a basic to-do list application with PHP and HTML.
Building a Simple To-Do List is a free PHP Academy lesson on CoddyKit — lesson 1 of 2. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the PHP Academy learning path, one of 2 lessons in the course, and your progress syncs across the web and the CoddyKit app.
1
Building a Simple To-Do List
Welcome to the lesson on building a simple to-do list! In this project, you’ll learn how to create a PHP application to add, display, and remove tasks. Let’s dive in!
2
Setting Up the Project
Before starting, ensure you have the following:
- A web server like XAMPP or WAMP.
- A text editor or IDE (e.g., VS Code).
- A file named
todo.phpin your project directory.
Key Point: This project will use PHP sessions to store tasks temporarily.
3
Creating the Basic HTML Structure
Start by creating the HTML layout for your to-do list application. Example:
Tip: Use the ul element to display the list of tasks.
<!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>
4
Starting the PHP Session
Use PHP sessions to store tasks across requests. Add this code to the top of your todo.php file:
Key Point: Sessions allow you to maintain data while navigating between pages.
<?php
session_start();
if (!isset($_SESSION['tasks'])) {
$_SESSION['tasks'] = [];
}
?>
5
Adding Tasks to the List
Process the form submission to add a new task to the session. Example:
Tip: Use trim() to remove unnecessary spaces from user input.
<?php
if (isset($_POST['add'])) {
$task = trim($_POST['task']);
if (!empty($task)) {
$_SESSION['tasks'][] = $task;
}
}
?>
6
Displaying the Task List
Use a loop to display the tasks stored in the session. Example:
Key Point: Each task includes a delete button to remove it from the list.
<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>
7
Deleting a Task
Process the delete button submission to remove tasks. Example:
Tip: Re-indexing ensures task indices remain consistent after deletion.
<?php
if (isset($_POST['delete'])) {
$key = $_POST['delete'];
unset($_SESSION['tasks'][$key]);
$_SESSION['tasks'] = array_values($_SESSION['tasks']); // Re-index the array
}
?>
8
Enhancing the Application
Here are some enhancements you can add:
- Style the application with CSS for a better user interface.
- Use JavaScript to add confirmation dialogs before deleting tasks.
- Store tasks in a database for persistent data storage.
Key Point: Enhancements make your application more user-friendly and functional.
9
10
Great Job!
Congratulations! You’ve built a simple to-do list application using PHP. You learned how to use sessions to store tasks, process form data, and dynamically display and delete tasks. In the next lesson, we’ll build another fun project to enhance your PHP skills. Let’s keep coding!
Frequently asked questions
Is the “Building a Simple To-Do List” lesson free?
Yes — the full text of “Building a Simple To-Do List” is free to read here on the web, and the PHP Academy course includes 2 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the PHP Academy course, upgrade to CoddyKit PRO.
What will I learn in “Building a Simple To-Do List”?
Create a basic to-do list application with PHP and HTML. You practise PHP Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start PHP Academy?
No prior experience is required. PHP Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 1 of 2, so you can start here or from the beginning and move at your own pace.
How long does the “Building a Simple To-Do List” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this PHP Academy lesson?
Yes. Every PHP Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- Building a Simple To-Do List
- Creating a Contact Form