Explore PDO, AJAX, and How to Add Header and Config in PHP

In this lesson, we explore the core functionalities of PHP PDO (PHP Data Objects), how to use AJAX for dynamic user interactions, and how to properly structure your project with header and configuration files. This approach is perfect for building real-world e-commerce applications, store dashboards, and functional web solutions.

By the end of this lesson, you will be able to set up a clean and maintainable PHP project structure, connect to databases securely using PDO, and implement AJAX to improve user experience without full page reloads.

1. Understanding PDO (PHP Data Objects)

PDO provides a consistent interface for accessing databases in PHP. Unlike the traditional MySQLi functions, PDO allows prepared statements, which protect your application from SQL injection attacks. Here's how to create a reusable PDO connection:


class DB {
    protected static $con;
    private function __construct() {
        try {
            self::$con = new PDO('mysql:host=localhost;dbname=your_store;charset=utf8','root','');
            self::$con->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
            self::$con->setAttribute(PDO::ATTR_PERSISTENT,false);
        } catch (PDOException $e) {
            echo "Could not connect to database.";
            exit;
        }
    }
    public static function getConnection() {
        if(!self::$con) {
            new DB();
        }
        return self::$con;
    }
}

Key Points:

Use `PDO::ATTR_ERRMODE` to handle errors properly.
Persistent connections (`PDO::ATTR_PERSISTENT`) improve performance for frequent queries.
Encapsulate your database connection to reuse across all scripts.

2. Setting Up Config and Header Files

To keep your project organized, we separate the configuration, header, and footer files. This ensures changes in one place affect the entire project.


// config.php
if(!defined('__CONFIG__')) exit;
if(!isset($_SESSION)) session_start();
include_once('DB.php');
include_once('filters.php');
include_once('functions.php');
$con = DB::getConnection();


// header.php
define('__CONFIG__', true); 
require_once('config.php'); 
$dir='http://localhost/your-store-directory';
?>


Store Task - Made by Ali

Benefits:

Centralized configuration for database and project constants.
Easy to include across multiple pages.
Improves maintainability for large projects.

3. Using AJAX for Dynamic Interactions

AJAX allows your web application to update content dynamically without refreshing the page. This improves user experience for tasks such as login, registration, or fetching product data.


$.ajax({
    url: 'fetch_data.php',
    method: 'POST',
    data: { productId: 123 },
    success: function(response) {
        $('#product-details').html(response);
    }
});

Practical Use: In e-commerce stores, AJAX can be used to update cart items, product listings, and live search results instantly, which enhances usability and conversion rates.

4. Styling Your Application

Use CSS for a clean, professional layout. Example for a main header:


.main-header { background-color: #253065; padding: 10px; color: #fff; }
.logo-header h4 { font-weight: bold; background-color: rgba(255,255,255,.7); padding: 15px 20px; border-radius: 8px; display: inline-block; }
.nav-header nav ul li a { color: #fff; border-bottom: .5px solid #fff; padding-bottom: 5px; }

This ensures your e-commerce project looks professional and is responsive on different devices.

5. Real-Life Business Example

Imagine an online store where users can browse products, add them to the cart, and complete purchases without reloading pages. Using PDO for secure database transactions and AJAX for dynamic interactions, you can:

Fetch product details instantly when the user hovers or clicks on a product.
Update shopping cart totals dynamically.
Handle user authentication and sessions safely.

6. Key Takeaways

PDO ensures secure and efficient database interactions.
AJAX improves user experience and performance.
Separating config and header files simplifies project management.
Structured CSS makes your project visually appealing and maintainable.
These practices are essential for real-world e-commerce applications.

Next: Mask All URLs on Your Server and Route Them to Dynamic PHP Views