🛍️

ProductCard

E-commerce product card with quick actions

89%
Code Reduction
350
Traditional Lines
39
Factory Lines
5
Frameworks

Code Example

const ProductCard = ui.createProductCard({
  product: {
    name: productName,
    price: productPrice,
    images: productImages,
    rating: 4.5,
    onSale: true
  },
  onAddToCart: () => addToCart(product),
  onToggleWishlist: () => toggleWishlist(product)
});

Usage

1. Install the package

npm install @vladimirdukelic/revolutionary-ui-factory

2. Import and setup

import { setup } from '@vladimirdukelic/revolutionary-ui-factory';
const ui = setup();

3. Create your component

Use the code example above to create your ProductCard component with 89% less code!

Features

  • ✓Image carousel
  • ✓Quick add to cart
  • ✓Wishlist toggle
  • ✓Price display
  • ✓Rating stars
  • ✓Sale badges

Supported Frameworks

React✓
Vue✓
Angular✓
Svelte✓
Solid✓