Skip to content

Aayush0966/React-Product-Page

Repository files navigation

🛍️ React Product Page

Welcome to the React Product Page project! This is a simple and responsive product listing website built using React, integrating a dummy JSON API for product data. The application includes key features like product search, filtering, a detailed product page, and a basic cart system.

🚀 Demo

Check out the live demo here: React Product Page

✨ Features

  • Product Listing: Fetches products using a dummy JSON API.
  • Search Functionality: Easily search for products by name.
  • Product Detail Page: View detailed information about each product.
  • Cart System: Add and remove products from your cart.
  • Filtering by Categories: Filter products based on categories.
  • Responsive Design: Fully responsive for mobile and desktop views.

🛠️ Tech Stack

  • React: A JavaScript library for building user interfaces.
  • Redux: For managing global state (e.g., cart system and product filtering).
  • Axios: For fetching data from the API.
  • Tailwind CSS: Utility-first CSS framework for rapid UI development.
  • React Router: For navigation between different pages (product listing, product detail, cart, etc.).

📦 Installation

To run this project locally:

  1. Clone the repository:
    git clone https://github.com/Aayush0966/React-Product-Page.git
  2. Navigate to the project directory:
    cd react-product-page
  3. Install dependencies:
    npm install
  4. Run the app:
    npm start

The app will start locally at http://localhost:3000.

💡 How it works

  1. The app fetches products from a dummy JSON API and displays them in a list format.
  2. Users can search for products using the search bar, filter by categories, and click on individual products to view more details.
  3. The cart system allows users to add/remove items and view their cart contents.
  4. Global state is managed using Redux, and Tailwind CSS is used for styling the application.

Made with ❤️ by AAYUSH

About

Welcome to the React Product Page project! This is a simple and responsive product listing website built using React, integrating a dummy JSON API for product data. The application includes key features like product search, filtering, a detailed product page, and a basic cart system.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages