ToDo Application

A web application made with PHP and Smarty as template engine, MySQL for the database and Apache as the server.

Index:

1. Backend

   • Structure

   • Handler

   • Routing

2. Frontend

   • Templates

   • Styles

The application classes for the MVC pattern are:

├─📂 classes
    - 🐘 ToDoModel.class.php
    - 🐘 ToDoView.class.php
    - 🐘 ToDoController.class.php

There are also some classes for the error handling and the configuration:

See more at classes.

Backend

I used MySQL.

Structure

Field	Type	Null	Key	Default	Extra
task_id	int(11)	NO	PRIMARY	NULL	auto_increment
task_title	varchar(30)	NO		NULL
task_description	varchar(200)	YES		NULL
task_done	tinyint(4)	NO		0

Handler

The handler is a class that handles the database connection and the queries.

Using the PDO class, the handler is able to execute queries and fetch the results.

public static function get_connection(): PDO {
    $dbh = new Dbh();
    $dsn = "mysql:host=" . $dbh->DB_HOST . ";dbname=" . $dbh->DB_NAME;
    $options = array(
        PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
        PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
        PDO::ATTR_EMULATE_PREPARES => false,
    );
    try {
        $db = new PDO($dsn, $dbh->DB_USER, $dbh->DB_PASS, $options);
    } catch (\PDOException $e) {
        $error = new ToDoError($e->getMessage(), (int) $e->getCode(), $e);
        $error->show_error();
        throw new \ToDoError($e->getMessage(), (int) $e->getCode());
    }
    return $db;
}

See more in the Dbh class file.

Routing

I used .htaccess to redirect the requests to the route.php file.

<IfModule mod_rewrite.c>
    
    # Rewrite rules for the application
    # Turns on the RewriteEngine
    RewriteEngine On
    # If the request is for a file, ignores it
    # If the request is for a directory, ignores it
    RewriteCond %{REQUEST_FILENAME} -f [OR]  
    RewriteCond %{REQUEST_FILENAME} -l

    RewriteRule ^[css|img|js|json].*$ - [L]
    # Ignores hidden files
    # Reroutes all requests to route.php with an action
    RewriteRule ^(.*)$ route.php?action=$1 [QSA,L]

</IfModule>

In the route.php file, I used an url parser to redirect the requests to the correct controller and method.

function url_parse(string $url): array {
    $url_data = explode('/', $url);
    $data_array[ConfigApp::$ACTION] = $url_data[0];
    $data_array[ConfigApp::$PARAMS] = isset($url_data[1]) ? array_slice($url_data, 1) : null;

    return $data_array;
}

See more in the route.php file.

Frontend

I went for a desing using Bootstrap 5 as a framework and a little touch of my own colorscheme styles.css.

I also used Smarty as template engine.

Templates

├───📂 templates
        - 📝 delete_modal.tpl
        - 📝 edit_task.tpl
        - 📝 error.tpl
        - 📝 footer.tpl
        - 📝 header.tpl
        - 📝 task.tpl
        - 📝 task_list.tpl

Styles

Colorscheme for a dark theme purple style.

html {
    --bg-red: #c64646 !important;
    --bg-red-darker: #b43737 !important;
    --bg-purple: #a551c9 !important;
    --bg-purple-darker: #9046b0 !important;
    --bs-body-font-family: 'Roboto', sans-serif !important;
}

.dark {
    background-color: #130c16;
    color: #fff;
}

See more in the styles.css file.