E-Commerce Web Application - React

Overview

This is a fully functional e-commerce web application built using React. The project includes essential features for an online store, such as product browsing, user authentication, shopping cart management, and order processing. The application is designed to provide a smooth and interactive shopping experience with a clean and responsive user interface.

Key Features

• User Authentication: Secure login, registration, and password recovery to protect user data.
• Product Management: Dynamic product display with categories, detailed product views, and user reviews.
• Shopping Cart: Fully functional cart system with the ability to add, update, and remove items.
• Order Processing: Efficient order management workflow, including review and confirmation steps.
• Protected Routes: Implements route protection to secure pages that require user authentication.
• User Profile: Manage user accounts, update personal information, and view order history.
• Real-time Notifications: Integrated toast notifications to inform users about their actions, errors, and updates.

Dependencies

This project leverages several key libraries and frameworks to enhance functionality:

• @fortawesome/free-brands-svg-icons, @fortawesome/free-regular-svg-icons, @fortawesome/free-solid-svg-icons: Font Awesome icon packs used for enhancing the UI with scalable vector icons.
• @fortawesome/react-fontawesome: React library to easily use Font Awesome icons within components.
• axios: A promise-based HTTP client for making API requests, handling responses, and managing errors seamlessly.
• bootstrap: A responsive CSS framework that provides pre-built components and utilities for faster web development.
• formik: A popular form management library that simplifies state handling, validation, and submission processes.
• jwt-decode: A lightweight library for decoding JSON Web Tokens (JWT) to access token data without verifying signatures.
• react: The core library for building user interfaces with component-based architecture.
• react-dom: Handles rendering of React components to the DOM and integrates React with web platforms.
• react-query: A powerful data-fetching library that manages server-state, caching, synchronization, and updates.
• react-router-dom: A declarative routing library that enables navigation and dynamic routing in React applications.
• react-toastify: Provides beautiful and customizable toast notifications for enhanced user feedback.
• swiper: A modern slider and carousel library that provides touch-friendly, responsive sliders for a better UI experience.
• toast: A simple library for creating lightweight, unobtrusive notifications.
• yup: A schema builder for runtime value parsing and validation, often paired with Formik to validate form inputs.

Getting Started

To get this project up and running locally:

1. Clone the repository:

   git clone https://github.com/zahaaMuhanna/E-commerce.git

2. Install the dependencies:

   npm install

3. Run the development server:

   npm start