Logo

E-Commerce Website Project

Welcome to the E-Commerce Website project repository! This project demonstrates the development of a dynamic e-commerce website for selling smart watches. The repository includes both front-end and back-end components.

(Note: The Website Server May be down 👎 or show Phishing website warning kindly ignore)

Updated Project Screenshots

App Screenshot App Screenshot App Screenshot App Screenshot

Project Screenshots

App Screenshot App Screenshot App Screenshot App Screenshot App Screenshot App Screenshot App Screenshot App Screenshot

Changelog

  • Added Email Verification support
    • To enable, follow these steps:
      • Modify the email address within PHP scripts
      • Configure with XAMPP server
  • Added Email Notification support on checkout
  • Added more validation to signup form
  • Changed the cart design and style
  • Fixed wishlist not displaying
  • Added new Checkout Module
    • Now includes color selection and address input

Project Overview

This project covers the following functionalities:

  • Login/Sign Up Page: Users can create accounts or log in using their credentials.
  • Product Detail Page: Detailed information about individual smart watches, including title, description, and pricing.
  • Product Listing Page: Displays a list of available smart watches with options for sorting and filtering.
  • Shopping Cart: Allows users to add/remove products, view the total price, and proceed to checkout.
  • Checkout: Displays the selected products, delivery and billing addresses, and provides a summary of the order.
  • Ratings and Reviews: Users can provide ratings and reviews for products they've purchased.
  • Recommendations: Provides product recommendations based on user preferences and browsing history.

Project Structure

The project structure is organized as follows:

  • /src: Contains the source code for the front-end and back-end components.
    • /frontend: Contains the front-end code for the user interface.
    • /backend: Contains the back-end code for handling data, authentication, and business logic.

Getting Started

  1. Clone this repository to your local machine.
  2. Navigate to the /res/css directory to work on the front-end code.
  3. Navigate to the /src/php directory to work on the back-end code.
  4. Follow the README instructions in each subdirectory to set up and run the respective components.

Technologies Used

  • Front-end: HTML, CSS, JavaScript, Bootstrap
  • Back-end: PHP, MySQL, Maria DB (or your preferred database)
  • User Authentication: JWT (JSON Web Tokens), AJAX
  • Additional Libraries: [List any additional libraries or frameworks used]

Contributing

If you'd like to contribute to this project, please follow these steps:

  1. Fork the repository.
  2. Create a new branch for your feature or bug fix.
  3. Make your changes and commit them with descriptive commit messages.
  4. Push your changes to your forked repository.
  5. Open a pull request to this repository's main branch.

Database Configuration

All SQL files are stored in ecommerce_db.sql that are required to get the details from the backend. Configure DB Connection.php for configuring the database.

How I Created This Website

I did research and went through CRUD and JavaScript documentation, designed a few PHP pages to learn scripting and interaction with the database. Then, I studied well-known e-commerce websites like Amazon and Flipkart. I also did some designing in Figma before finally implementing the website.

License

This project is made as an interview challenge for Hyscaler.

Feel free to reach out if you have any questions or suggestions. Happy coding!