Hello readers, I am Hardik Thummar and in this blog i am sharing experience of building my first ever clone of an e-commerce website called Shoppersstop.com.

About Shoppersstop.com:

It is retail service provider of leading international and national brands for apparels, fragrances, accessories, cosmetics, footwear, home decor and furnishings catering to the needs of the entire family. It is one of the largest chain of department stores across India.

About our project:

I along with my teammate @SeemaAlam, have created this clone using,

• mongoDB
• express
• Node.js
• EJS & css.

Landing/Home page:

Below is the landing page of our clone, where we have implemented image carousels, product slider and drop-down menus as well from where user can navigate to the desired products.

Product page:

Below is the product page, where users can check out the varieties of one product. We have implemented the filters through JavaScript and DOM manipulation, so that user can filter out the products based on different properties i.e, price, brand, colour, size.

Product description page:

Below is the description page of one selected product. Here we have implemented carousel to showcase the all aspects of the selected product along with all the details and offers.

Product cart page:

Below is the product cart page, where user can see the product added to cart and the cost summary. moreover user can change the product quantity or remove it from cart. We have adde promo-code feature for extra discount on purchase.

Signin & sugnup page:

Below are the signin and signup pages from where user can create new account or signin to existing account using mobile number or email.

Challenges that we face while starting Project:

We were working with such a feature rich website for the first time, it was hard to manage the time and implement all the features that were there in main website as some of them were a bit complex to create as a begginer. At same time, it was totally new experience to work on same files and collaborating with team online.

How we overcome our challenges:

We tried to do the collaborative work on the small parts first to get a hang of GitHub and by supporting each other, we were able to overcome our chalanges.

Key learning points during this journey:

• How to plan & distribute work and communicate with the team.
• How to present the project with the team.
• How to improve my productivity and improve self-learning.
• How to approach complex features.

Conclusion:

Overall, building this project was a good experience, as i understood the importance of time management, communication/collaboration and self learning as well.

For a glance of the project, click here GitHub repo.

I hope you liked the project and enjoyed reading this blog. Please share your feedback or suggesions in comment section. Bbye!!