E-Commerce Store

Table of Contetns

• Table of Contetns
• About The App
• Live Demo
• Features
  • For Shoppers
  • For Admins
• Technologies
• Setup
• Demo
• Available Users
• License

About The App

Discover the ultimate shopping destination for all your tech needs at E-Commerce, the innovative e-commerce platform designed for gadget enthusiasts. E-Commerce offers a wide range of high-quality products including laptops, cell phones, TVs, and headphones. Our user-friendly app ensures a seamless shopping experience on any device, thanks to its responsive design that adapts perfectly to all screen sizes.

Live Demo

Click here

Features

For Shoppers

• Shop with Ease: Browse our extensive catalog of tech products and make purchases with just a few taps.
• Save for Later: Not ready to buy? Add items to your cart and decide later.
• Dark Mode: Shop at any hour without straining your eyes, thanks to our optional dark mode.

For Admins

• Complete Control: Manage product listings with full CRUD operations. Add, update, and delete products with ease.
• Live Preview: Get a real-time preview of products as you create or update them, ensuring accuracy before going live.

Built on a robust platform with a proprietary E-Commrece backend API, E-Commerce prioritizes reliability and speed, making it the go-to app for tech lovers everywhere. Whether you're a casual shopper or a tech aficionado, E-Commerce is designed to cater to your needs, making it easier than ever to keep up with the latest technology trends.

Technologies

• React and TypeScript: Built a dynamic and responsive frontend.
• TailwindCSS: Utilized for all design features, enhancing the UI with minimalistic and responsive styles.
• React Router: Implemented for seamless navigation between pages.
• React Hook Form: Employed for robust form validation.
• SweetAlert2: Used for popup dialogs, improving user interactions with sleek, responsive alerts.
• MaterialUI: Leveraged for reusable components like Menu and Ratings, ensuring a consistent and modern UI.
• React Icons: Integrated for SVG icons, enriching the visual experience.
• Infinite Scroll Component: Implemented on the Product page to enhance pagination and make the user experience more intuitive.
• Modern Drawer: Used for sorting and filtering menus, offering users an efficient way to navigate product options.
• Swiper: Utilized on the homepage to display best sellers on small screen devices, ensuring smooth and responsive browsing.

Setup

Ensure that you have at least Node.JS version 18.0.0 installed.

Ensure that the backend is operational. See the setup instructions for the ECommerceStore-backend.

Clone the repository with the following command:

git clone https://github.com/Maksim-Mirkin/ECommerceStore-Frontend.git

Install all dependencies by running:

npm install

Start the app with:

npm run dev

Demo

Available Users

• Admin

  username: admin

  password: Pass0rd1!

• Customer

  username: customer

  password: Pass0rd1!

License

This project is licensed under the Apache License, Version 2.0 - see the LICENSE file for details.