13.1 Introduction to E-commerce Web Components

E-commerce means buying and selling through a website. Common models: B2C (business to consumer, e.g. an online shop), B2B, C2C (marketplaces). A typical site has two sides:

Customer side (storefront)	Admin side (back office)
Register, log in, reset password	Manage products and categories
Browse, search, filter, paginate	Manage orders and statuses
Product detail page	Manage users and roles
Cart and checkout	Sales reports
Pay online, receive email	Inventory control
Order history, likes, wishlist	Coupons and promotions

Recommended folder structure

Folder structure

shop/
├── config/db.php            database connection
├── includes/                header.php, footer.php, auth.php, functions.php
├── public/ (or root)        index.php, product.php, cart.php, checkout.php, login.php, register.php
├── admin/                   dashboard.php, products.php, orders.php, users.php
├── api/                     cart_add.php, like.php, search.php (AJAX endpoints returning JSON)
├── assets/                  css/, js/, images/, uploads/
└── vendor/                  Composer packages (PHPMailer, payment SDK)

Database design (core tables)

SQL

CREATE TABLE categories (
  id INT AUTO_INCREMENT PRIMARY KEY,
  name VARCHAR(100) NOT NULL
);

CREATE TABLE products (
  id INT AUTO_INCREMENT PRIMARY KEY,
  category_id INT,
  name VARCHAR(150) NOT NULL,
  description TEXT,
  price DECIMAL(10,2) NOT NULL,
  stock INT NOT NULL DEFAULT 0,
  image VARCHAR(255),
  like_count INT NOT NULL DEFAULT 0,
  FOREIGN KEY (category_id) REFERENCES categories(id)
);

CREATE TABLE users (
  id INT AUTO_INCREMENT PRIMARY KEY,
  name VARCHAR(100) NOT NULL,
  email VARCHAR(150) NOT NULL UNIQUE,
  password_hash VARCHAR(255) NOT NULL,
  role ENUM('customer','staff','admin') NOT NULL DEFAULT 'customer'
);

CREATE TABLE orders (
  id INT AUTO_INCREMENT PRIMARY KEY,
  user_id INT NOT NULL,
  total DECIMAL(10,2) NOT NULL,
  status ENUM('pending','paid','shipped','cancelled') NOT NULL DEFAULT 'pending',
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
  FOREIGN KEY (user_id) REFERENCES users(id)
);

CREATE TABLE order_items (
  id INT AUTO_INCREMENT PRIMARY KEY,
  order_id INT NOT NULL,
  product_id INT NOT NULL,
  qty INT NOT NULL,
  unit_price DECIMAL(10,2) NOT NULL,      -- price at time of purchase
  FOREIGN KEY (order_id) REFERENCES orders(id),
  FOREIGN KEY (product_id) REFERENCES products(id)
);

Core e-commerce tables and how they link: an order has many order items, each pointing to a product

Golden rules for e-commerce: never trust prices or totals sent from the browser (always read price from the database); hash passwords; use prepared statements; escape output; use HTTPS; keep secrets (API keys, database password) out of public folders and out of Git.