An E-commerce website based on lifestyle products. This is Individual Projects, made by me in 4 days. I have used React Library for all functionalities and used Chakra UI as a external CSS.
This project is made by using React
- Social Sign-up/Sign-in. 2. basic User authentication with Local Storage. 3. Local Storage to manage user data. 4. Add to cart. 5. Delete products from the cart. 6. payment forms for valid users 7. API integration for products 8. Context API for manage state 9. Chakra UI for external CSS
Upper section have 1. Menu bar for selecting country. 2. Customer care details 3. Register Panel 4. Login Panel 5. Admin Panel Lower section have some routes a search box a wishlistand a cart button
some attractive images in Grid formate and view all button to see all related products
User will have to register before using all functions of this site. Registration form is here, user can register with his Email or Google and Facebook as well. His data will be save in localstorage.
User will have to Login after registration. Only registered user can be login. Login form is here, user can Login with his registered Email and Password or Google and Facebook as well. His data will be save in localstorage.
After clicking on the view all button from homepage It will redirect to Products page. All Products are here in the grid formate with few details and Buy Now Button. After clicking on the Buy Now button It will be re-directed on the Products details page where you will get all details of the particular product.
User can see all the products which are added by him into cart. After clicking on the cart button all products will be in list formate. user can remove the products from cart if he want otherwise he can proceed to payment .
After clicking on the Proceed to Payment
button, user will be redirected on the payment page. User can fill the card details and after clicking on the Pay button products will be ordered.
In the Navbar section a Admin button is there. It is for Admin only. If Admin want to add, update or delete products from his database then he can go through the Admin Page.
Snapshots of Admin page
Before Login
After Login
After Clicking on the button