Skip to content

ArpanSurin/Product-Catalog

Repository files navigation

PRODUCT CATALOG

Overview

This project is a simple yet functional product catalogue website built with React. The application allows users to browse through a list of products, add them to a shopping cart, and view the total cost of the items in the cart.

The website features a responsive design, making it accessible and user-friendly across various devices.

Note : This project is developed as a part of my internship at CodSoft

Features

Product Listing : Display a list of products with their names and prices. Each product is presented in a visually appealing card component.

Shopping Cart : Users can add products to the shopping cart. The cart displays the added products along with their prices. Users can remove products from the cart. The total cost of the items in the cart is dynamically calculated and displayed.

Responsive Design : The layout adjusts gracefully to different screen sizes, ensuring a seamless experience on both desktop and mobile devices.

Tech Stack

React : For building the user interface and managing the state.

Tailwind CSS : For styling the components and creating a responsive design.

JavaScript (ES6) : For logic and interactivity.

Local State Management : React's useState hook is used to manage the state of blog posts within the application.

Installation & Setup

  1. Clone the Repository :
git clone https://github.com/ArpanSurin/Product-Catalog.git
  1. Navigate to project directory :
cd Product-Catalog
  1. Install Dependencies :
npm install
  1. Start the Website :
npm run dev
  1. Open the application in your browser :
 http://localhost:5173