SHOP.COM

CLONING OF OUT WEBSITE SHOP.COM

This blog is created to share our experience of working on a project assigned to us by Masai School,which was to create a clone of the shop.com website in 6 days

Our group consist of the following member:

• Ankit Singh Yadav.
• Pratik Jawanjal.
• Anish Singh.
• Monika Sananse.
• Prajakta Khadse.
• Nageshwar Nath Tripathi

TECHNOLOGY STACK WE USED

• HTML.
• CSS.
• JAVASCRIPT.

EXPECTATION:

We are expecting to create a pixel-perfect cloned site of shop.com website within four days. with all its pages,given proper HTML,CSS properties,using DOM and MEDIA QUERY concepts with respect to the official Shop.com website.

ROLES AND RESPONSIBITLIES:

1. We started by going through the website,studying its design,layouts,content etc.
2. We started to go with the first page first.We divided the main page into three parts the navigation bar, the body and the footer.
3. I worked on the navbar, sidebar and sign in and sign up page .
4. Prajakta and Pratik worked on the body parts and footer part.
5. Ankit worked on the add to cart functionality and created the pages that link with shop.com product.
6. Anish worked on the link clothing page and its functionality.
7. In the end we had to combine all the works together and upload on the GitHub.

CHALLENGES WE FACED AND HOW WE SOLVED THEM:

As it was the first time for us collaborating remotely on a project .We faced a quite a few challenges while developing the clone.The challenges we can remember are as follow:-

• Git was completely new to us and thus it became a challenge the merge the code on GitHub.
• Another challenge was solving the problem of the Javascript part of local Storage . It happened sometimes that there were few redundant classes and the output used to get disoriented.Solving it required a thorough checkup of class names and id names.effective communication among us so that we could prevent it from happeing.
• As we are not using UI libraries yet, we faced a lot of challenges while getting similar layout with different screen sizes.Although we were able to manage most of it,this issue is something that we got to know could only be resolved with the UI libraries, so we decided to move on and fix other things.

LETS HAVE LOOK FINAL OUTPUT OF OUT WEBSITE:

SUMMARY:-

As we mentioned earlier,we were able to attain the required layout because of the communication that we maintained.The command chain that we follow and the level of understanding about the topic we had.I felt proud to work with such amazing people of my group.This project could not have been possible without the contribution of our group members