Sports-K E-Commerce


Sports-K is a e-commerce website which offers sports based products like men’s clothes and shoes and women’s clothes and shoes. It allows you to buy clothes and shoes online with payment gateway integration. you can add your favourite product or you can also search by using filters. There are diffrent type or variety of clothes and shoes available in this website. you just have to follow the steps and after some steps you will able to place your order and buy products which you are store in your cart.

TECH STACK : HTML(1.3%),CSS(2.3%),JavaScript(96.4%).

FUNCTIONALITIES : Register, Login, Products, Filter, Wishlist, CartPage, CheckoutPage, coupon, discount, payment, order , adminpage etc.

Dependency : react, react-router-dom, react-redux, redux, redux-thunk, axios, react-icons, chakra-UI/react, chakra-UI/Icons, swal etc.

  1. Navbar

Khamaliya navbar

  1. Footer

In the footer part I have add my linkedin , github , and portfolio website. you can check by clicking to them.

Khamaliya Footer

  1. Home

It is the main page where I gave a 3 link on image. you can directly access this page by clicking to the relevant page.

Khamaliya Home

  1. Products

This is the products page where you can see the variety of products. for find the relevant product you can use the filter. In the filter part you can search by category. you choice your favourite color and buy the item. you can choose your gender so you will be able to see the all products which only men wear.

Khamaliya Item Page

  1. Description

Here is the Description page where you can see the description about the products from this page you can add product to the wishlist and you can also select the size first and than add product into the bag. The number of item you select for wishlist or cart is shown on the top of the navbar.

Khamaliya description

  1. WishList

Wishlist is the page where you can add the Item which is your favourite. if you want to buy that item you can simply click to the item. so you will redirect to the description page where you can add this item to the cart.

Khamaliya wishlist

  1. Cart

The Products which we want to buy is in the cart section. In this cart section you can increase and decrease the quantity of product and the price is in the right side of the component. if you increase quantity your price will also increas. after this you can go to the checkout page.

Khamaliya cart

  1. Checkout

In the checkout page there is a form which we fill for fulfiling our details to buy the products. So in this section I validate all the input fields so you have to enter the correct form of details or you are not able to place the order. there is a coupon part where you can apply the coupon so you can get the discount on particular product.

Khamaliya checkout

  1. Register

In this page you have to register your details so you will login the credentials. remember you username and password for login the right credentials Khamaliya signup

  1. Login

we can login by username and password after login we are redirected to the homepage. but if I enter the admin username and password so i will redirected to the admin page where I can edit the details and change the price and name etc. other thing from admin side. user will able to the changes in website. I can also delete the product from admin side

Khamaliya login

  1. Payment

Khamaliya payment

  1. Admin

Khamaliya admin

Contributed by

Naresh Rajput

Deploy Link

Link :

If you Like Give it a


View Github