Anthropologie || Clone

This is the clone website of ANTHROPOLOGIE || https://www.anthropologie.com/

deployed link || Anthropologie.com

Video Explainer of flow control || Video Drive Link

Contributors

• @Gaurav Singh
• @Ajit Shelake
• @Sachin Shukla
• @Akash Kumar
• @Abhinav

We used HTML CSS JAVASCRIPT and local storage for making our website good and working.

In this clone website we added such functionlity as following:-

1. sign up -- in this the mobile number should be 10 digit and the password should be greater then 6 digit or it will pop an error alert.

2. sign in -- in this the user have to put the right email and the correct password to log in and after logIn the user can see his details in right side of the navbar. Only those user can sign in which are successfully sign up otherwise gives error. and a logout button if user click on logout it will be logged out.

3. navbar -- Created with the unordered list with hover function.

4. When hover on text of navbar ordered list is accessible. So that easy to interface.

5. home page --In Homepage, Images are added and style with help of display grid property. Buttons are given on top of image with the help of Position sticky and absolute, while clicking on button you will be landing on the product pages.

6. We have also used Carousel slideshow for sliding through a series of images and on top of it given the button with appears while hover on it with some opacity.

7. sort -- This functionality is added to help the user to sort item of their own choice and i have used javascript to achieve this.

8. filter -- This functionality will help the user to filter item on the basis of size,price etc so that the user can get a good idea of thier product.

9. Zoom -- This functionality is added to make the page look a bit attractive and it is done by using css.

10. image change and colour -- while some of the products chane their image on hovering. and you can see the avalible colours in the bottom of the product.

11. add to cart page --Fetching product image name and price from each product page using javascript

12. ADD TO BASKET-- button on clicking on it each item gets added to cart this functionality is added using addevenlistener

13. footer -- so we have created a user friendly footer so you can go to contact us and our storys and you can connect to us by our networks.

14. search -- we have added search functionlity for serching any-thing you have to go on perticular section and you will be find the result if it is not in the section it will say the item is not avalible.

15. cart page -- in cart page we can increese the quantity of the product and acording to the quantity price will increese and if the cart have more then two items you can see the price of each and the total will be shown outside in chekout box with all the total. (note -- if you are not logged in then the adding in cart will not work.)

16. promo code -- we gave a promo code (masai30) for discount of 30 % . it will only deduct from total.

17. address page -- after clicking checkout you will have to fill the address if you are not filling it it will say please fill the details.

18. payment page -- after filling the data user have to fill the card details currect (we give some hard coded data to it) if everything is currect the you will see popup (OTP SENDED).

19. OTP Page -- you have to fill the currect otp and it will say payment done and you will be redirected to the home page. and the cart will be empty.