amazon_clone Tailwind Templates

Amazon_clone

A fully functional Amazon clone built with React, Tailwind CSS, Redux Toolkit, Framer Motion, and more!

Amazon Clone :tv:

A web application that allows users to browse, search, and purchase products from a variety of categories, offering a wide range of features and functionalities similar to the original Amazon app.


Features :fire:

:tv: Product Listings, Product Search and Product Details.
:tv: Filter based on Rating, Price and Category.
:tv: Sort based on High Price, Low Price and Rating.



:tv: Add to cart and Buy Now.



:tv: Cart Page with Quantity increase/decrease, Delete Product and Clear Cart.



:tv: User Registration and Login.



:tv: Save Multiple Addresses.



:tv: Order History, Cancel and Return Order.



Tech Stack :computer:

:bulb: Front-end React, Redux Toolkit, Tailwind-CSS, Framer Motion, Loading Spinner
:bulb: Back-end Firebase

Usage :pencil:

:zap: Visit the live demo or run the app locally.
:zap: Browse products, add items to your cart, and proceed to checkout.
:zap: Sign in or create an account for a personalized experience.
:zap: Enjoy a smooth and intuitive shopping experience!

Folder Structure

amazon-clone/
├── node_modules/
├── public/
│   ├── index.html
│   └── ... (other public assets)
├── src/
│   ├── api/
│   │   └── api.js
│   ├── assets/
│   │   └── index.js
│   ├── components/
│   │   ├── cart/
│   │   │   ├── cart.js
│   │   │   ├── cartItems.js
│   │   │   ├── cartProduct.js
│   │   │   └── emptyCart.js
│   │   ├── checkout/
│   │   │   ├── addressForm.js
│   │   │   ├── cardDetails.js
│   │   │   ├── checkout.js
│   │   │   ├── OrderSummary.js
│   │   │   ├── PaymentMethods.js
│   │   │   └── userAddresses.js
│   │   ├── error/
│   │   │   └── error.js
│   │   ├── footer/
│   │   │   ├── footer.js
│   │   │   ├── footerTop.js
│   │   │   ├── footerMiddle.js
│   │   │   ├── footerMiddleList.js
│   │   │   └── footerBottom.js
│   │   ├── header/
│   │   │   ├── header.js
│   │   │   ├── headerBottom.js
│   │   │   ├── location.js
│   │   │   ├── search.js
│   │   │   └── sideNavContent.js
│   │   ├── home/
│   │   │   ├── Category.js
│   │   │   ├── Home.js
│   │   │   ├── ProductsSlider.js
│   │   │   ├── scrollBar.css
│   │   │   └── slider.js
│   │   ├── login/
│   │   │   ├── createAccount.js
│   │   │   ├── forgotPassword.js
│   │   │   └── signIn.js
│   │   ├── orders/
│   │   │   ├── orderDetails.js
│   │   │   └── Orders.js
│   │   └── products/
│   │       ├── Product.js
│   │       ├── ProductDetails.js
│   │       └── Products.js
│   ├── constants/
│   │   └── index.js
│   ├── contexts/
│   │   ├── userAddressContext.js
│   │   └── userCartContext.js
│   ├── firebase/
│   │   └── firebase.config.js
│   ├── redux/
│   │   ├── amazonSlice.js
│   │   └── store.js
│   ├── app.js
│   ├── index.js
│   └── index.css
├── tailwind.config.js
└── README.md

Installation :notebook:

  1. To install the Amazon Clone, use git:
    git clone https://github.com/kumardinesh1908/amazon-clone.git
    
    To deploy this project, simply open the index.html file in your browser.
  2. Install dependencies:
    npm install
    
  3. Start the development server:
    npm start
    

Live Demo

 https://amazon-clone-kumardinesh1908.vercel.app

Top categories

Loading Svelte Themes