Attirely

screenshot of Attirely
react
chakra-ui
firebase

It's a clone of Myntra, an online shopping website for men's & women's clothing

Overview

This group project focuses on frontend functionality using React and Redux, with Firebase being used for the backend. The project is an ecommerce website that has all the major functionality from the user side to the admin side. The user interface is fully responsive for all screen sizes, and the payment gateway used is Razorpay.

Features

  • Login and Signup: Users can create an account and login using Firebase Authentication.
  • Product Sorting: Products can be sorted based on category, brand, discount range, and price, with pagination.
  • Search Functionality: Users can search for products with debouncing.
  • Skeleton Loading: A skeleton loading effect is shown while the content is being loaded.
  • My Profile Section: Users can view details of all ordered items in their profile.
  • Cart Management: Users can add, remove, and update quantities of items in their cart.
  • RazorPay Payment Gateway: Integration with RazorPay for secure payment processing.
  • Responsiveness: The website is fully responsive for all screen sizes.
  • Admin Dashboard: Admins have access to all statistics, can perform CRUD operations for products, and view data on orders and users.

Summary

This project is a comprehensive ecommerce website developed using React, Redux, and Firebase. It includes all the major features required for an ecommerce platform, such as user authentication, product sorting and searching, cart management, and payment integration. The website is also fully responsive and includes an admin dashboard for managing products, orders, and users. Overall, Attirely provides a complete solution for online shopping.

react
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

chakra-ui
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.

firebase
Firebase

Firebase offers a comprehensive set of features, including real-time database, authentication, hosting, cloud functions, storage, and more. Firebase provides an easy-to-use interface and allows developers to focus on building features rather than managing infrastructure.

framer-motion
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.