Gadget Store

Description

This is an e-commerce web application for an online gadget store. Users can explore a catalog of products, view detailed product pages, add products to their cart and favorites, and proceed with checkout. The app features smooth interactions, responsive design, and user-friendly navigation.

Technologies Used

• React: For building the user interface.
• Redux: For state management, including cart and favorites functionality.
• CSS Modules: For component-level styling.
• React Router: For navigation and routing.
• LocalStorage: To persist cart and favorites data across page reloads.
• TypeScript: This is for type safety and a better development experience.

Preview

You can view the live demo of the project at GitHub Pages.

Mockup

The design of the application is based on the following mockups: Link to Mockup.

Project Structure

• src/components/: Contains reusable components for UI elements.
• src/modules/: Includes individual page modules (HomePage, CartPage, etc.) and shared content.
• src/assets/: Contains images used throughout the application.

How to Run the Project Locally

To run this project locally, follow these steps:

Prerequisites

• Node.js: Please make sure you have Node.js installed. This project is tested with Node.js v20. You can download it from Node.js official website.

Steps

1. Clone the Repository:

   git clone https://github.com/yourusername/gadgets-catalog.git
   cd gadgets-catalog

2. Install Dependencies:

   npm install

3. To create a production build:

   npm run build

4. Run the Vite preview (for local development)::

   npm run start

5. Open your browser and visit the local server to see the app running.