Asos Clone
Asos is an e-commerce website. Have built the user flow of the website from sign up to placing the orders with cart updation feature
Overview
ASOS is a popular online fashion and cosmetic retailer based in the UK. Founded in 2000, ASOS primarily caters to young adults. This product analysis focuses on a clone of the ASOS website that was created during the Unit 4 construct week at Masai. The clone website includes various features and functionalities, and it utilizes a combination of HTML, JavaScript, CSS, React, Redux, Chakra UI, and Json Server.
Features
- User signup and login pages with form validation and data management through Json Server.
- Home page showcasing featured items.
- Three product pages with product data managed through Json Server.
- Sorting and filtering functionality for easy navigation.
- Cart page with options to update the size and quantity of selected items.
- Checkout page for reviewing and finalizing the order.
- Payment page with confirmation of payment.
Summary
The ASOS clone project is a functional replica of the ASOS website. It includes various features such as user authentication, product pages, sorting and filtering functionality, a cart page, and a checkout process. The clone project utilizes HTML, JavaScript, CSS, React, Redux, Chakra UI, and Json Server to provide a seamless user experience. By cloning ASOS, the development team at Masai has created a project that showcases their skills in frontend development and web technologies. The live link to the clone project can be accessed at https://papaya-tarsier-65f2d1.netlify.app/.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Bootstrap
Bootstrap is the most popular CSS Framework for developing responsive and mobile-first websites.
- Chakra UI
Chakra UI is a popular open-source React component library that provides a set of accessible and customizable UI components to help developers create modern web applications.
- Framer Motion
Alpine.js is a lightweight JavaScript framework that simplifies the process of creating dynamic, reactive user interfaces on the web. It uses a declarative syntax that offers a higher level of abstraction compared to vanilla JavaScript, while being more performant and easier to use than jQuery.
- Redux
Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.