MyShup Ecommerce App

Welcome to MyShup! This is a simple ecommerce web application built using HTML, CSS, Tailwind CSS, and TypeScript. MyShup allows users to browse through products, add items to the cart, and make purchases.

Table of Contents

Features

  • Home Page:

    • Hero Section: A visually appealing introduction section that provides an overview of the app's features.
    • Product List: Displays a variety of products with essential details such as name, price, and images.
    • Product Filtering: Allows users to sort and filter products based on different criteria to find exactly what they're looking for.
    • Newsletter Subscription: Enables users to subscribe to a newsletter to receive updates about new products and offers.
    • Footer: Includes important links, contact information, and social media links for users to stay connected.
  • Product Page:

    • Product Details: Displays comprehensive information about an individual product, including specifications and features.
    • Add to Cart: Provides an option to add the product to the cart, allowing users to seamlessly continue shopping.
  • Cart:

    • Cart Overview: Shows a summary of the items added to the cart, including product names, quantities, and total prices.
    • Item Manipulation: Allows users to increase or decrease the quantity of items in the cart and remove items if needed.
    • Proceed to Checkout: Offers a button that takes users to the checkout page to finalize their purchase.
  • Checkout:

    • Personal Information: Collects user's personal details, such as name, address, and contact information, for order processing.
    • Payment Integration: Integrates Paystack as the payment platform for secure and convenient payment processing.

Technologies Used

Installation

  1. Clone this repository: git clone https://github.com/NwekeGoddy/totalitycorp-frontend-challenge
  2. Navigate to the project directory: cd myshup

Usage

  1. Open the index.html file in your preferred web browser to access the home page.
  2. Navigate to the product page by clicking on a product from the product list.
  3. Add items to your cart, proceed to checkout, and complete your purchase.

Screenshots

  • Home Page 1

  • Product Page 2

  • Checkout Page 3

Website

Visit the website: MyShup

Developed by Nweke Chidi