An open API service indexing awesome lists of open source software.

https://github.com/orhanweb/react-ecommerce-case

A simple e-commerce app built with React and TypeScript. Users can browse products, filter by category, and add items to their cart. The app uses context API for cart management and stores data in localStorage to persist the cart even after page reloads. The project is deployed on GitHub Pages.
https://github.com/orhanweb/react-ecommerce-case

reactjs tailwindcss typescript

Last synced: 22 days ago
JSON representation

A simple e-commerce app built with React and TypeScript. Users can browse products, filter by category, and add items to their cart. The app uses context API for cart management and stores data in localStorage to persist the cart even after page reloads. The project is deployed on GitHub Pages.

Awesome Lists containing this project

README

          

# React E-commerce Case

A simple e-commerce app built with **React** and **TypeScript**. Users can browse products, filter by category, and add items to their cart. The app uses the context API for cart management and stores data in `localStorage` to persist the cart even after page reloads.

This project is deployed on **GitHub Pages** and you can try the app live by clicking the link below:

👉 [Try the Live Demo](https://orhanweb.github.io/react-ecommerce-case/)

Click the link and experience the app for yourself! Browse products, add them to your cart, and explore the features directly in your browser.

## Features

- Browse products by category
- Add products to your cart
- View and remove products from the cart
- Persist cart items in `localStorage`, so they stay even after page reloads
- **Light / Dark Theme Toggle**: Easily switch between light and dark themes for better user experience
- Responsive design for mobile and desktop views
- Built with **ShadCN UI** for an elegant and customizable UI

## Technologies

- **React** (with hooks)
- **TypeScript**
- **Vite** (for fast development and bundling)
- **GitHub Pages** (for deployment)
- **ShadCN UI** (for modern, responsive, and customizable UI components)
- **localStorage** (to persist cart data across sessions)

## Setup

To run this project locally, follow these steps:

1. Clone the repository:

```bash
git clone https://github.com/orhanweb/react-ecommerce-case.git
```

3. Navigate to the project directory:

```bash
cd react-ecommerce-case
```

5. Install dependencies:
```bash
npm install
```

6. Run the development server:
```bash
npm start
```

The app will be running at `http://localhost:3000`.

## Usage

1. Browse through different product categories.
2. Add products to your cart.
3. The cart items are stored in `localStorage`, so even if you refresh the page, your cart will be preserved.