To-Do List

A simple To-Do List application built with plain PHP, MySQL, jQuery and CSS.

What it does

• Add, complete, and delete tasks
• Filter tasks by status (All / Active / Completed)
• Bulk delete all completed tasks at once
• All interactions are async (no page reloads) via AJAX

Tech stack

Layer	Technology
Backend	PHP 8.0+
Database	MySQL
Frontend	jQuery, CSS
Migrations	Plain SQL files

Project structure

todo-app/
├── index.php                        # Front controller — all requests start here
├── serve.php                        # Dev server launcher
├── .htaccess                        # Rewrites all URLs to index.php (Apache)
├── .env                             # Local credentials — never commit this
├── .env.example                     # Template to copy from
├── db.php                           # Database connection (reads from .env)
├── app/
│   ├── Router.php                   # Lightweight router with named URL params
│   ├── controllers/
│   │   └── TaskController.php
│   ├── models/
│   │   └── Task.php                 # All database queries live here
│   └── views/
│       ├── layout.php               # HTML shell (head, scripts)
│       └── tasks/
│           └── index.php            # Main task list UI
├── assets/
│   ├── app.css
│   └── app.js
└── db/
    └── migrations/
        └── 001_create_tasks_table.sql

Routes

GET    /                      Renders the app
GET    /api/tasks             Returns all tasks as JSON
POST   /api/tasks             Creates a new task
POST   /api/tasks/{id}/toggle Toggles completed state
DELETE /api/tasks/{id}        Deletes a task

Setup

1. Database

Run the migration to create the database and table:

mysql -u root -p < db/migrations/001_create_tasks_table.sql

2. Environment

Copy the example env file and fill in your credentials:

cp .env.example .env

DB_HOST=localhost
DB_NAME=todo_app
DB_USER=your_user
DB_PASS=your_password

3. Running

Option A — built-in PHP dev server (no Apache needed)

php serve.php        # http://localhost:8000
php serve.php 9000   # http://localhost:9000

Option B — Apache / XAMPP

Point your virtual host document root at the project folder. The .htaccess handles URL rewriting automatically.