Readme:
Product Listing and Details Web Application: This repository contains the source code for a simple web application that allows users to browse a list of products, search for specific products, filter them by category, and sort them based on different criteria. Additionally, users can click on a product to view detailed information on a separate page.
Table of Contents *Introduction *Features *Getting Started *Usage *Folder Structure *Dependencies *Contributing *License
Introduction: This web application is built using HTML, JavaScript, and SCSS. It fetches product data from a dummy API and dynamically updates the user interface based on user interactions such as search, filtering, and sorting. The application consists of two main pages - the product listing page (index.html) and the product details page (product.html).
Features:
Product Listing Page:
Display a list of products with basic information. Allow users to search for products by keyword. Provide a category filter to narrow down the product list. Enable sorting of products by default or price.
Product Details Page:
Show detailed information about a selected product. Display product image, title, price, discount, category, and stock.
Getting Started Clone the repository: git clone https://github.com/RevanGozelov4847/Assignment2.git
Open the index.html file in a web browser to view the index.html page.
For detailed product information, click on a product card to navigate to the product.html page.
Usage:
Product Listing Page (index.html):
Use the search bar to filter products by keyword. Select a category from the dropdown to filter products accordingly. Choose a sorting criteria from the dropdown to arrange products.
Product Details Page (product.html):
View detailed information about a specific product.
Folder Structure:
dist/: Contains compiled CSS files. script/: Includes JavaScript files for the application logic. styles/: Contains SCSS files for styling. pages/: Holds additional HTML pages. README.md: Documentation for the project.
Dependencies:
No external libraries or frameworks are used. The application fetches product data from a dummy API.
Contributing:
Contributions are welcome! Please check the contributing guidelines for more details.
License:
This project is licensed under the MIT License. Feel free to use and modify the code for your own purposes.