Sports-K is an e-commerce website that 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 favorite product or you can also search by using filters. There are different types or varieties of clothes and shoes available on this website. you just have to follow the steps and after some steps, you will able to place your order and buy products that you are storing in your cart.
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.
In the footer part, I have added my LinkedIn, GitHub, and portfolio website. you can check by clicking on them.
It is the main page where I gave 3 links on the image. you can directly access this page by clicking on the relevant page.
This is the products page where you can see the variety of products. To find the relevant product you can use the filter. In the filter part, you can search by category. you choose 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.
Here is the Description page where you can see the description of the products from this page you can add the product to the wishlist and you can also select the size first and then add the product to the bag. The number of the item you select for the wishlist or cart is shown on the top of the navbar.
Wishlist is the page where you can add the Item which is your favorite. if you want to buy that item you can simply click on the item. so you will redirect to the description page where you can add this item to the cart.
The Products which we want to buy are in the cart section. In this cart section, you can increase and decrease the quantity of a product and the price is on the right side of the component. if you increase quantity your price will also increase. after this, you can go to the checkout page.
On the checkout page, There is a form that we fill for fulfill 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 a discount on the particular product.
You can register your information on this page. You will be logged in when you fill the correct information.
We can log in by username and password after login we are redirected to the homepage. but if I enter the admin username and password so I will be redirected to the admin page where I can edit the details and change the price and name etc. another thing from the admin side. user will able to the changes to the website. I can also delete the product from the admin side.
Contributed by
Link : https://nareshrajput-sports-site.vercel.app/
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent