π― Project Overview developed a responsive e-commerce website as part of my Web Engineering course in the 5th semester. The purpose of this project was to simulate a real-world online shopping experience, incorporating both frontend and backend functionality, with a focus on dynamic behavior, database interaction, and user authentication.
π οΈ Technology Stack project uses the classic LAMP stack and frontend tools:
HTML β For structuring web pages.
CSS β For styling and making the design responsive across devices.
JavaScript β For client-side interactivity (e.g., cart updates, form validations).
PHP β For backend logic (user login, admin panel, product management).
MySQL β For storing user data, products, and orders in a relational database.
β Note: All files are stored in the master branch β not the main branch. Be sure to switch to master when reviewing the code on GitHub.
π‘ Key Features
- Product Categories Products are grouped into relevant categories (e.g., electronics, clothing, accessories).
Helps users browse and filter items easily.
Categories are dynamically rendered from the database.
- Shopping Cart Users can add/remove items from the cart.
Cart updates without page reload (thanks to JavaScript/AJAX).
Total cost is calculated automatically.
Items are stored temporarily or persistently based on login status.
- User Authentication Login & Registration system for users.
Validations on the frontend and backend.
Users must be logged in to checkout or place orders.
Passwords likely hashed for security (if implemented).
- Admin Panel Admin login separates regular users from admin access.
Admins can:
Add new products with name, price, category, image, and description.
Delete or update existing products.
Admin interface is secure and hidden from regular users.
- Smooth Checkout Process Upon checkout:
User confirms address and payment option.
Cart data is stored in the orders table in the database.
Confirmation message is shown after successful order placement.
π Modern UI & Responsiveness Clean, modern layout using CSS and media queries.
Fully responsive: works well on mobile, tablet, and desktop.
May include animations or transitions to enhance UX.
ποΈ Code Structure Assuming your code is organized well:
/assets β CSS, images, and JavaScript files.
/admin β Admin panel pages.
/includes β Reusable components like header, footer, database config.
/products β Product-related scripts and views.
index.php β Home page.
login.php, register.php, cart.php, checkout.php β Main pages.
db.php β Database connection file.
ποΈ Important: If someone is checking your GitHub, they should switch to the master branch as your work is stored there (not the main).
π¦ Extra Features You Can Highlight (If Present) Product image upload via admin panel.
Session management using PHP.
Cart persistence using PHP sessions or database.
Responsive navbar and product grid.
Basic form validations (e.g., empty fields, invalid inputs).
Error handling and user feedback (e.g., login errors, successful product addition).