Ssense Clone

SSENSE is a multi-brand retailer based in Montreal, Canada specialising in the sale of designer fashion and high end streetwear. It was founded as an e-commerce platform in 2003 by three brothers: Rami, Bassel and Firas Atallah.

About this project:

This is a team project, built by us in the Construct Week - Unit 3 at Masai School. Deployed link of Netlify :https://ssense-6040cb.netlify.app/

Team Members ❤️

• Suraj Dongre
• Md Sahil Amaan
• Sharang Ahirekar
• Sirtaj Khan
• Himanshu Singh Pokhariya

Pages and features:

Home Page: Nav Bar with fully functioned with all categories.

Sign-Up/Sign-In: User authentication to check whether user id and password match with details existing in the database else if visiting first time then creat an account.

Product Category Page: All products depending upon the gender and age created dynamically with filter by category, price, latest/old and color as well.

Cart: User can see or remove products added in the cart.

Checkout Page: User can choose different payment methods depending on his/her preference and can procced to checkout.

Payment Page: Users can add their payment details and can complete the transaction with OTP authentication.

Order Successful: Order successful message will be displayed over the screen and redirect to the home page automatically.

Additional Features: Kept the fonts, colors and favicon and titles consistent throughtout the whole site to give a feel like the original site and also wishlist feature is added to give more real experience.

Screenshots

• Homepage
• Mens page
• Womens page
• Product page
• Paypal Integration

Tech Stack:

HTML

CSS

JavaScript: import/export, fetch API, local storage

API Reference

Get all items

  GET https://asos2.p.rapidapi.com/products/v2/list?store=US&offset=0&categoryId=4209&limit=48&country=US&sort=${price}&q=${query}&base_colour=${color}&currency=USD&sizeSchema=US&lang=en-US

Get item

Parameter	Type	Description
query	string	Required. name of item to fetch
sort	string	Required. sort category to fetch
color	number ID	Required. color id to fetch

Roles and Responsibilities:

• GitHub is Managed & Readme.md done by Suraj.

• The navbar is designed, functionality done by Suraj

• The Landing Page is designed & functioned by Himanshu & Suraj.

• The sign-up and sign-in page is designed and functioned by Sirtaj.

• Filter/sorting by category page, sort by color and price is designed and functioned by Suraj.

• All products page and sorting data is designed & functioned by Suraj.

• Products add to shopping bag is designed, and functioned by Sharang.

• Shopping bag page is designed & functioned by Md Sahil Amaan.

• Checkout page is designed and functioned by Sharang.

• Paypal payment method integrated by Sharang.

• Wishlist function is designed by Sharang.

• Code optimization done by Suraj.

Some screenshots of our website:

Learning

• We all became proficient in reading the code of team members.

• Our code writing style became cleaner as we had to think while writing code that other team members will be reading.

• We had to learn about many CSS properties that we didn't know before.

• Our skills in JavaScript specially in Fetch API, import/export, DOM manipulation etc. became better.

• We all learned how to plan a project and execute that.

Feedback

If you have any feedback, please reach out to us at [email protected], [email protected], [email protected], [email protected], [email protected]