פיתוח חנות אונליין 2025: המדריך המלא להקמת E-commerce מצליח

💰 למה E-commerce זה הזדמנות הזהב של 2025?

השוק הדיגיטלי מתפוצץ, והמספרים מדברים בעד עצמם:

נתוני השוק הגלובלי:

• 🌍 $6.3 טריליון - גודל שוק ה-E-commerce ב-2025
• 📈 27% מהקניות יתבצעו אונליין עד סוף השנה
• 📱 72% מהרכישות יתחילו או יסתיימו במובייל
• 🚀 95% צמיחה שנתית בחנויות D2C (Direct to Consumer)
• 💳 $150 מיליארד ב-Buy Now Pay Later עד 2025

🏗️ בחירת הפלטפורמה הנכונה

1. השוואת פלטפורמות מובילות

2. Headless Commerce Architecture

// Headless commerce setup with Next.js + Shopify
// lib/shopify.js
const domain = process.env.SHOPIFY_STORE_DOMAIN;
const storefrontAccessToken = process.env.SHOPIFY_STOREFRONT_ACCESS_TOKEN;

async function ShopifyData(query) {
  const URL = `https://${domain}/api/2024-01/graphql.json`;

  const options = {
    endpoint: URL,
    method: "POST",
    headers: {
      "X-Shopify-Storefront-Access-Token": storefrontAccessToken,
      "Accept": "application/json",
      "Content-Type": "application/json",
    },
    body: JSON.stringify({ query })
  };

  try {
    const data = await fetch(URL, options).then(response => {
      return response.json();
    });

    return data;
  } catch (error) {
    throw new Error("Products not fetched");
  }
}

// Get all products
export async function getAllProducts() {
  const query = `
    {
      products(first: 250) {
        edges {
          node {
            id
            title
            handle
            description
            images(first: 5) {
              edges {
                node {
                  url
                  altText
                }
              }
            }
            priceRange {
              minVariantPrice {
                amount
                currencyCode
              }
            }
            variants(first: 100) {
              edges {
                node {
                  id
                  title
                  availableForSale
                  priceV2 {
                    amount
                    currencyCode
                  }
                }
              }
            }
          }
        }
      }
    }
  `;

  const response = await ShopifyData(query);
  const allProducts = response.data.products.edges 
    ? response.data.products.edges 
    : [];

  return allProducts;
}

// Create checkout
export async function createCheckout(id, quantity) {
  const query = `
    mutation {
      checkoutCreate(input: {
        lineItems: [{ variantId: "${id}", quantity: ${quantity} }]
      }) {
        checkout {
          id
          webUrl
          lineItems(first: 5) {
            edges {
              node {
                title
                quantity
              }
            }
          }
          totalPrice {
            amount
            currencyCode
          }
        }
      }
    }
  `;

  const response = await ShopifyData(query);
  const checkout = response.data.checkoutCreate.checkout 
    ? response.data.checkoutCreate.checkout 
    : [];

  return checkout;
}

// Update checkout
export async function updateCheckout(id, lineItems) {
  const query = `
    mutation {
      checkoutLineItemsUpdate(checkoutId: "${id}", lineItems: ${lineItems}) {
        checkout {
          id
          webUrl
          lineItems(first: 5) {
            edges {
              node {
                title
                quantity
              }
            }
          }
          totalPrice {
            amount
            currencyCode
          }
        }
      }
    }
  `;

  const response = await ShopifyData(query);
  const checkout = response.data.checkoutLineItemsUpdate.checkout 
    ? response.data.checkoutLineItemsUpdate.checkout 
    : [];

  return checkout;
}

3. Custom E-commerce Backend

// Node.js + Express + MongoDB e-commerce backend
// models/Product.js
const mongoose = require('mongoose');

const productSchema = new mongoose.Schema({
  name: {
    type: String,
    required: [true, 'Product name is required'],
    trim: true,
    maxLength: [100, 'Product name cannot exceed 100 characters']
  },
  slug: {
    type: String,
    unique: true,
    lowercase: true,
    index: true
  },
  description: {
    type: String,
    required: [true, 'Product description is required'],
    maxLength: [2000, 'Description cannot exceed 2000 characters']
  },
  price: {
    type: Number,
    required: [true, 'Product price is required'],
    min: [0, 'Price cannot be negative']
  },
  compareAtPrice: {
    type: Number,
    min: [0, 'Compare price cannot be negative']
  },
  cost: {
    type: Number,
    min: [0, 'Cost cannot be negative']
  },
  sku: {
    type: String,
    unique: true,
    sparse: true
  },
  barcode: String,
  inventory: {
    quantity: {
      type: Number,
      default: 0,
      min: [0, 'Quantity cannot be negative']
    },
    trackInventory: {
      type: Boolean,
      default: true
    },
    allowBackorder: {
      type: Boolean,
      default: false
    }
  },
  images: [{
    url: {
      type: String,
      required: true
    },
    alt: String,
    position: Number
  }],
  variants: [{
    name: String,
    options: [{
      value: String,
      price: Number,
      quantity: Number,
      sku: String
    }]
  }],
  categories: [{
    type: mongoose.Schema.Types.ObjectId,
    ref: 'Category'
  }],
  tags: [String],
  brand: {
    type: mongoose.Schema.Types.ObjectId,
    ref: 'Brand'
  },
  reviews: [{
    type: mongoose.Schema.Types.ObjectId,
    ref: 'Review'
  }],
  rating: {
    average: {
      type: Number,
      default: 0,
      min: 0,
      max: 5
    },
    count: {
      type: Number,
      default: 0
    }
  },
  seo: {
    title: String,
    description: String,
    keywords: [String]
  },
  status: {
    type: String,
    enum: ['active', 'draft', 'archived'],
    default: 'active'
  },
  featured: {
    type: Boolean,
    default: false
  },
  publishedAt: Date,
  createdAt: {
    type: Date,
    default: Date.now
  },
  updatedAt: {
    type: Date,
    default: Date.now
  }
}, {
  timestamps: true,
  toJSON: { virtuals: true },
  toObject: { virtuals: true }
});

// Virtual for discount percentage
productSchema.virtual('discountPercentage').get(function() {
  if (this.compareAtPrice && this.compareAtPrice > this.price) {
    return Math.round(((this.compareAtPrice - this.price) / this.compareAtPrice) * 100);
  }
  return 0;
});

// Index for search
productSchema.index({ 
  name: 'text', 
  description: 'text',
  tags: 'text' 
});

// Index for filtering
productSchema.index({ price: 1, rating: -1 });
productSchema.index({ categories: 1, status: 1 });
productSchema.index({ createdAt: -1 });

// Pre-save middleware to generate slug
productSchema.pre('save', function(next) {
  if (!this.slug) {
    this.slug = this.name
      .toLowerCase()
      .replace(/[^w ]+/g, '')
      .replace(/ +/g, '-');
  }
  next();
});

// Method to check availability
productSchema.methods.isAvailable = function() {
  if (!this.inventory.trackInventory) return true;
  if (this.inventory.allowBackorder) return true;
  return this.inventory.quantity > 0;
};

// Static method to get featured products
productSchema.statics.getFeatured = function(limit = 8) {
  return this.find({ 
    featured: true, 
    status: 'active' 
  })
  .sort('-createdAt')
  .limit(limit)
  .populate('brand', 'name logo');
};

module.exports = mongoose.model('Product', productSchema);

🛒 Shopping Cart & Checkout

1. Advanced Cart Management

// React Shopping Cart with Context API
// contexts/CartContext.jsx
import React, { createContext, useContext, useReducer, useEffect } from 'react';

const CartContext = createContext();

const cartReducer = (state, action) => {
  switch (action.type) {
    case 'ADD_TO_CART': {
      const existingItem = state.items.find(
        item => item.id === action.payload.id && 
                JSON.stringify(item.variant) === JSON.stringify(action.payload.variant)
      );

      if (existingItem) {
        return {
          ...state,
          items: state.items.map(item =>
            item.id === action.payload.id && 
            JSON.stringify(item.variant) === JSON.stringify(action.payload.variant)
              ? { ...item, quantity: item.quantity + action.payload.quantity }
              : item
          )
        };
      }

      return {
        ...state,
        items: [...state.items, action.payload]
      };
    }

    case 'REMOVE_FROM_CART':
      return {
        ...state,
        items: state.items.filter(item => item.id !== action.payload)
      };

    case 'UPDATE_QUANTITY':
      return {
        ...state,
        items: state.items.map(item =>
          item.id === action.payload.id
            ? { ...item, quantity: action.payload.quantity }
            : item
        ).filter(item => item.quantity > 0)
      };

    case 'CLEAR_CART':
      return {
        ...state,
        items: []
      };

    case 'SET_DISCOUNT':
      return {
        ...state,
        discount: action.payload
      };

    case 'SET_SHIPPING':
      return {
        ...state,
        shipping: action.payload
      };

    default:
      return state;
  }
};

export const CartProvider = ({ children }) => {
  const [state, dispatch] = useReducer(cartReducer, {
    items: [],
    discount: null,
    shipping: null
  }, (initial) => {
    // Load cart from localStorage
    if (typeof window !== 'undefined') {
      const saved = localStorage.getItem('cart');
      return saved ? JSON.parse(saved) : initial;
    }
    return initial;
  });

  // Save cart to localStorage
  useEffect(() => {
    if (typeof window !== 'undefined') {
      localStorage.setItem('cart', JSON.stringify(state));
    }
  }, [state]);

  // Calculate totals
  const calculateTotals = () => {
    const subtotal = state.items.reduce(
      (total, item) => total + (item.price * item.quantity),
      0
    );

    let discountAmount = 0;
    if (state.discount) {
      if (state.discount.type === 'percentage') {
        discountAmount = subtotal * (state.discount.value / 100);
      } else {
        discountAmount = state.discount.value;
      }
    }

    const shippingCost = state.shipping?.cost || 0;
    const tax = (subtotal - discountAmount) * 0.17; // 17% VAT
    const total = subtotal - discountAmount + shippingCost + tax;

    return {
      subtotal,
      discountAmount,
      shippingCost,
      tax,
      total,
      itemCount: state.items.reduce((count, item) => count + item.quantity, 0)
    };
  };

  const value = {
    cart: state,
    dispatch,
    totals: calculateTotals(),
    addToCart: (product) => dispatch({ type: 'ADD_TO_CART', payload: product }),
    removeFromCart: (id) => dispatch({ type: 'REMOVE_FROM_CART', payload: id }),
    updateQuantity: (id, quantity) => dispatch({ 
      type: 'UPDATE_QUANTITY', 
      payload: { id, quantity } 
    }),
    clearCart: () => dispatch({ type: 'CLEAR_CART' }),
    applyDiscount: (code) => {
      // Validate discount code
      return validateDiscountCode(code).then(discount => {
        if (discount) {
          dispatch({ type: 'SET_DISCOUNT', payload: discount });
          return true;
        }
        return false;
      });
    },
    setShipping: (method) => dispatch({ type: 'SET_SHIPPING', payload: method })
  };

  return (
    <CartContext.Provider value={value}>
      {children}
    </CartContext.Provider>
  );
};

export const useCart = () => {
  const context = useContext(CartContext);
  if (!context) {
    throw new Error('useCart must be used within CartProvider');
  }
  return context;
};

// Cart UI Component
const ShoppingCart = () => {
  const { cart, totals, updateQuantity, removeFromCart, applyDiscount } = useCart();
  const [discountCode, setDiscountCode] = useState('');
  const [isApplyingDiscount, setIsApplyingDiscount] = useState(false);

  const handleApplyDiscount = async () => {
    setIsApplyingDiscount(true);
    const success = await applyDiscount(discountCode);
    if (success) {
      toast.success('Discount applied successfully!');
      setDiscountCode('');
    } else {
      toast.error('Invalid discount code');
    }
    setIsApplyingDiscount(false);
  };

  if (cart.items.length === 0) {
    return (
      <div className="empty-cart">
        <svg className="empty-cart-icon" viewBox="0 0 24 24">
          <path d="M17,18A2,2 0 0,1 19,20A2,2 0 0,1 17,22C15.89,22 15,21.1 15,20C15,18.89 15.89,18 17,18M1,2H4.27L5.21,4H20A1,1 0 0,1 21,5C21,5.17 20.95,5.34 20.88,5.5L17.3,11.97C16.96,12.58 16.3,13 15.55,13H8.1L7.2,14.63L7.17,14.75A0.25,0.25 0 0,0 7.42,15H19V17H7C5.89,17 5,16.1 5,15C5,14.65 5.09,14.32 5.24,14.04L6.6,11.59L3,4H1V2M7,18A2,2 0 0,1 9,20A2,2 0 0,1 7,22C5.89,22 5,21.1 5,20C5,18.89 5.89,18 7,18M16,11L18.78,6H6.14L8.5,11H16Z"/>
        </svg>
        <h2>Your cart is empty</h2>
        <p>Add some products to get started!</p>
        <Link href="/products" className="btn btn-primary">
          Continue Shopping
        </Link>
      </div>
    );
  }

  return (
    <div className="shopping-cart">
      <div className="cart-items">
        {cart.items.map(item => (
          <div key={`${item.id}-${JSON.stringify(item.variant)}`} className="cart-item">
            <img src={item.image} alt={item.name} />
            <div className="item-details">
              <h3>{item.name}</h3>
              {item.variant && (
                <p className="variant">
                  {Object.entries(item.variant).map(([key, value]) => 
                    `${key}: ${value}`
                  ).join(', ')}
                </p>
              )}
              <p className="price">₪{item.price}</p>
            </div>
            <div className="quantity-controls">
              <button 
                onClick={() => updateQuantity(item.id, item.quantity - 1)}
                disabled={item.quantity <= 1}
              >
                -
              </button>
              <span>{item.quantity}</span>
              <button 
                onClick={() => updateQuantity(item.id, item.quantity + 1)}
                disabled={item.quantity >= item.maxQuantity}
              >
                +
              </button>
            </div>
            <div className="item-total">
              ₪{(item.price * item.quantity).toFixed(2)}
            </div>
            <button 
              className="remove-btn"
              onClick={() => removeFromCart(item.id)}
              aria-label="Remove item"
            >
              ×
            </button>
          </div>
        ))}
      </div>

      <div className="cart-summary">
        <div className="discount-code">
          <input
            type="text"
            placeholder="Discount code"
            value={discountCode}
            onChange={(e) => setDiscountCode(e.target.value)}
          />
          <button 
            onClick={handleApplyDiscount}
            disabled={!discountCode || isApplyingDiscount}
          >
            {isApplyingDiscount ? 'Applying...' : 'Apply'}
          </button>
        </div>

        {cart.discount && (
          <div className="discount-applied">
            <span>Discount: {cart.discount.code}</span>
            <span>-₪{totals.discountAmount.toFixed(2)}</span>
          </div>
        )}

        <div className="totals">
          <div className="total-line">
            <span>Subtotal:</span>
            <span>₪{totals.subtotal.toFixed(2)}</span>
          </div>
          {totals.discountAmount > 0 && (
            <div className="total-line discount">
              <span>Discount:</span>
              <span>-₪{totals.discountAmount.toFixed(2)}</span>
            </div>
          )}
          <div className="total-line">
            <span>Shipping:</span>
            <span>{totals.shippingCost > 0 ? `₪${totals.shippingCost.toFixed(2)}` : 'Free'}</span>
          </div>
          <div className="total-line">
            <span>Tax (VAT 17%):</span>
            <span>₪{totals.tax.toFixed(2)}</span>
          </div>
          <div className="total-line total">
            <span>Total:</span>
            <span>₪{totals.total.toFixed(2)}</span>
          </div>
        </div>

        <Link href="/checkout" className="btn btn-primary btn-block">
          Proceed to Checkout
        </Link>

        <div className="security-badges">
          <img src="/badges/ssl-secure.svg" alt="SSL Secure" />
          <img src="/badges/pci-compliant.svg" alt="PCI Compliant" />
        </div>
      </div>
    </div>
  );
};

2. Smart Checkout Flow

// Multi-step checkout with validation
const CheckoutFlow = () => {
  const [step, setStep] = useState(1);
  const [formData, setFormData] = useState({
    email: '',
    shipping: {},
    billing: {},
    payment: {},
    shippingMethod: null
  });
  const [errors, setErrors] = useState({});
  const { cart, totals } = useCart();

  const steps = [
    { id: 1, name: 'Information', icon: '📧' },
    { id: 2, name: 'Shipping', icon: '📦' },
    { id: 3, name: 'Payment', icon: '💳' },
    { id: 4, name: 'Review', icon: '✅' }
  ];

  const validateStep = (stepNumber) => {
    const newErrors = {};

    switch(stepNumber) {
      case 1:
        if (!formData.email) newErrors.email = 'Email is required';
        if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) {
          newErrors.email = 'Invalid email address';
        }
        break;

      case 2:
        const required = ['firstName', 'lastName', 'address', 'city', 'postalCode'];
        required.forEach(field => {
          if (!formData.shipping[field]) {
            newErrors[`shipping.${field}`] = `${field} is required`;
          }
        });
        break;

      case 3:
        if (!formData.payment.method) {
          newErrors['payment.method'] = 'Payment method is required';
        }
        if (formData.payment.method === 'card') {
          if (!formData.payment.cardNumber) {
            newErrors['payment.cardNumber'] = 'Card number is required';
          }
          // Add more card validation
        }
        break;
    }

    setErrors(newErrors);
    return Object.keys(newErrors).length === 0;
  };

  const nextStep = () => {
    if (validateStep(step)) {
      setStep(step + 1);
    }
  };

  const prevStep = () => {
    setStep(step - 1);
  };

  const submitOrder = async () => {
    try {
      const orderData = {
        items: cart.items,
        totals,
        customer: {
          email: formData.email,
          ...formData.shipping
        },
        shipping: formData.shipping,
        billing: formData.billing.sameAsShipping ? formData.shipping : formData.billing,
        payment: formData.payment,
        shippingMethod: formData.shippingMethod
      };

      const response = await fetch('/api/orders', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(orderData)
      });

      if (response.ok) {
        const order = await response.json();
        router.push(`/order-confirmation/${order.id}`);
      }
    } catch (error) {
      console.error('Order submission failed:', error);
    }
  };

  return (
    <div className="checkout-flow">
      <CheckoutProgress currentStep={step} steps={steps} />

      <div className="checkout-content">
        <div className="checkout-form">
          {step === 1 && <InformationStep formData={formData} setFormData={setFormData} errors={errors} />}
          {step === 2 && <ShippingStep formData={formData} setFormData={setFormData} errors={errors} />}
          {step === 3 && <PaymentStep formData={formData} setFormData={setFormData} errors={errors} />}
          {step === 4 && <ReviewStep formData={formData} cart={cart} totals={totals} />}

          <div className="checkout-actions">
            {step > 1 && (
              <button onClick={prevStep} className="btn btn-secondary">
                Back
              </button>
            )}
            {step < 4 ? (
              <button onClick={nextStep} className="btn btn-primary">
                Continue
              </button>
            ) : (
              <button onClick={submitOrder} className="btn btn-primary">
                Place Order
              </button>
            )}
          </div>
        </div>

        <OrderSummary cart={cart} totals={totals} />
      </div>
    </div>
  );
};

💳 Payment Integration

1. Multiple Payment Gateways

// Payment gateway abstraction
class PaymentGateway {
  constructor(provider) {
    this.provider = provider;
    this.initialize();
  }

  initialize() {
    switch(this.provider) {
      case 'stripe':
        this.gateway = new StripeGateway();
        break;
      case 'paypal':
        this.gateway = new PayPalGateway();
        break;
      case 'square':
        this.gateway = new SquareGateway();
        break;
      default:
        throw new Error(`Unsupported payment provider: ${this.provider}`);
    }
  }

  async processPayment(amount, paymentMethod, metadata) {
    return this.gateway.process(amount, paymentMethod, metadata);
  }

  async refund(transactionId, amount) {
    return this.gateway.refund(transactionId, amount);
  }
}

// Stripe implementation
class StripeGateway {
  constructor() {
    this.stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
  }

  async process(amount, paymentMethod, metadata) {
    try {
      // Create payment intent
      const paymentIntent = await this.stripe.paymentIntents.create({
        amount: Math.round(amount * 100), // Convert to cents
        currency: 'ils',
        payment_method: paymentMethod,
        confirm: true,
        metadata
      });

      return {
        success: true,
        transactionId: paymentIntent.id,
        status: paymentIntent.status
      };
    } catch (error) {
      return {
        success: false,
        error: error.message
      };
    }
  }

  async refund(transactionId, amount) {
    try {
      const refund = await this.stripe.refunds.create({
        payment_intent: transactionId,
        amount: amount ? Math.round(amount * 100) : undefined
      });

      return {
        success: true,
        refundId: refund.id
      };
    } catch (error) {
      return {
        success: false,
        error: error.message
      };
    }
  }

  // Setup payment element
  async createPaymentElement() {
    const paymentIntent = await this.stripe.paymentIntents.create({
      amount: 1000,
      currency: 'ils',
      automatic_payment_methods: {
        enabled: true,
      },
    });

    return paymentIntent.client_secret;
  }
}

// Frontend Stripe integration
const StripeCheckout = ({ amount, onSuccess, onError }) => {
  const stripe = useStripe();
  const elements = useElements();
  const [isProcessing, setIsProcessing] = useState(false);

  const handleSubmit = async (event) => {
    event.preventDefault();

    if (!stripe || !elements) return;

    setIsProcessing(true);

    const { error, paymentIntent } = await stripe.confirmPayment({
      elements,
      confirmParams: {
        return_url: `${window.location.origin}/payment-success`,
      },
      redirect: 'if_required'
    });

    if (error) {
      onError(error.message);
    } else if (paymentIntent.status === 'succeeded') {
      onSuccess(paymentIntent);
    }

    setIsProcessing(false);
  };

  return (
    <form onSubmit={handleSubmit}>
      <PaymentElement />
      <button disabled={!stripe || isProcessing}>
        {isProcessing ? 'Processing...' : `Pay ₪${amount}`}
      </button>
    </form>
  );
};

2. Buy Now Pay Later (BNPL)

// BNPL integration (Klarna example)
class BNPLProvider {
  constructor() {
    this.providers = {
      klarna: new KlarnaProvider(),
      afterpay: new AfterpayProvider(),
      affirm: new AffirmProvider()
    };
  }

  async checkEligibility(amount, customer) {
    const eligibility = {};

    for (const [provider, instance] of Object.entries(this.providers)) {
      eligibility[provider] = await instance.checkEligibility(amount, customer);
    }

    return eligibility;
  }

  async createSession(provider, orderData) {
    return this.providers[provider].createSession(orderData);
  }
}

class KlarnaProvider {
  constructor() {
    this.apiKey = process.env.KLARNA_API_KEY;
    this.apiSecret = process.env.KLARNA_API_SECRET;
  }

  async checkEligibility(amount, customer) {
    // Check if amount is within Klarna's limits
    if (amount < 35 || amount > 3000) {
      return { eligible: false, reason: 'Amount out of range' };
    }

    // Additional eligibility checks
    const response = await fetch('https://api.klarna.com/payments/v1/sessions', {
      method: 'POST',
      headers: {
        'Authorization': `Basic ${Buffer.from(`${this.apiKey}:${this.apiSecret}`).toString('base64')}`,
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        purchase_country: 'IL',
        purchase_currency: 'ILS',
        locale: 'he-IL',
        order_amount: amount * 100,
        order_lines: [{
          type: 'physical',
          name: 'Product',
          quantity: 1,
          unit_price: amount * 100,
          total_amount: amount * 100
        }]
      })
    });

    if (response.ok) {
      return { eligible: true, sessionId: (await response.json()).session_id };
    }

    return { eligible: false, reason: 'Not available' };
  }

  async createSession(orderData) {
    // Create Klarna checkout session
    const session = await fetch('https://api.klarna.com/checkout/v3/orders', {
      method: 'POST',
      headers: {
        'Authorization': `Basic ${Buffer.from(`${this.apiKey}:${this.apiSecret}`).toString('base64')}`,
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        purchase_country: 'IL',
        purchase_currency: 'ILS',
        locale: 'he-IL',
        order_amount: orderData.total * 100,
        order_tax_amount: orderData.tax * 100,
        order_lines: orderData.items.map(item => ({
          type: 'physical',
          reference: item.sku,
          name: item.name,
          quantity: item.quantity,
          unit_price: item.price * 100,
          tax_rate: 1700, // 17% VAT
          total_amount: item.price * item.quantity * 100,
          total_tax_amount: item.price * item.quantity * 17
        })),
        merchant_urls: {
          terms: 'https://example.com/terms',
          checkout: 'https://example.com/checkout',
          confirmation: 'https://example.com/confirmation',
          push: 'https://example.com/api/klarna/push'
        }
      })
    });

    return await session.json();
  }
}

📦 Inventory & Fulfillment

1. Real-time Inventory Management

// Inventory tracking system
class InventoryManager {
  constructor() {
    this.redis = new Redis();
    this.db = database;
  }

  async checkAvailability(productId, quantity = 1, variantId = null) {
    const key = variantId ? `inventory:${productId}:${variantId}` : `inventory:${productId}`;
    const available = await this.redis.get(key);

    if (available === null) {
      // Cache miss, fetch from database
      const product = await this.db.products.findById(productId);
      const stock = variantId 
        ? product.variants.find(v => v.id === variantId)?.quantity 
        : product.inventory.quantity;

      await this.redis.setex(key, 300, stock); // Cache for 5 minutes
      return stock >= quantity;
    }

    return parseInt(available) >= quantity;
  }

  async reserveStock(items, duration = 900) { // 15 minutes default
    const reservationId = uuid();
    const multi = this.redis.multi();

    for (const item of items) {
      const key = item.variantId 
        ? `inventory:${item.productId}:${item.variantId}`
        : `inventory:${item.productId}`;

      // Decrement available stock
      multi.decrby(key, item.quantity);
      
      // Store reservation
      multi.setex(
        `reservation:${reservationId}:${item.productId}`,
        duration,
        JSON.stringify(item)
      );
    }

    const results = await multi.exec();
    
    // Check if any stock went negative
    for (let i = 0; i < items.length; i++) {
      if (results[i * 2][1] < 0) {
        // Rollback
        await this.releaseReservation(reservationId);
        throw new Error(`Insufficient stock for product ${items[i].productId}`);
      }
    }

    return reservationId;
  }

  async releaseReservation(reservationId) {
    const pattern = `reservation:${reservationId}:*`;
    const keys = await this.redis.keys(pattern);

    for (const key of keys) {
      const item = JSON.parse(await this.redis.get(key));
      const inventoryKey = item.variantId
        ? `inventory:${item.productId}:${item.variantId}`
        : `inventory:${item.productId}`;

      await this.redis.incrby(inventoryKey, item.quantity);
      await this.redis.del(key);
    }
  }

  async confirmReservation(reservationId, orderId) {
    const pattern = `reservation:${reservationId}:*`;
    const keys = await this.redis.keys(pattern);

    for (const key of keys) {
      const item = JSON.parse(await this.redis.get(key));
      
      // Update database
      await this.db.products.updateOne(
        { _id: item.productId },
        { $inc: { 'inventory.quantity': -item.quantity } }
      );

      // Create inventory log
      await this.db.inventoryLogs.create({
        productId: item.productId,
        variantId: item.variantId,
        type: 'sale',
        quantity: -item.quantity,
        orderId,
        timestamp: new Date()
      });

      // Clean up reservation
      await this.redis.del(key);
    }
  }

  // Low stock alerts
  async checkLowStock() {
    const products = await this.db.products.find({
      'inventory.trackInventory': true,
      'inventory.quantity': { $lte: { $ref: 'inventory.lowStockThreshold' } }
    });

    for (const product of products) {
      await this.sendLowStockAlert(product);
    }
  }

  async sendLowStockAlert(product) {
    // Send email notification
    await emailService.send({
      to: process.env.ADMIN_EMAIL,
      subject: `Low Stock Alert: ${product.name}`,
      template: 'low-stock',
      data: {
        product: product.name,
        sku: product.sku,
        currentStock: product.inventory.quantity,
        threshold: product.inventory.lowStockThreshold
      }
    });

    // Send Slack notification
    await slackService.send({
      channel: '#inventory-alerts',
      text: `🚨 Low stock alert: ${product.name} (SKU: ${product.sku}) - Only ${product.inventory.quantity} units left!`
    });
  }
}

2. Order Fulfillment Workflow

// Order fulfillment system
class FulfillmentService {
  constructor() {
    this.statuses = {
      PENDING: 'pending',
      PROCESSING: 'processing',
      PACKED: 'packed',
      SHIPPED: 'shipped',
      DELIVERED: 'delivered',
      CANCELLED: 'cancelled',
      REFUNDED: 'refunded'
    };
  }

  async processOrder(orderId) {
    const order = await Order.findById(orderId);
    
    try {
      // Update status
      await this.updateOrderStatus(orderId, this.statuses.PROCESSING);

      // Verify inventory
      await this.verifyInventory(order.items);

      // Generate picking list
      const pickingList = await this.generatePickingList(order);

      // Send to warehouse
      await this.sendToWarehouse(pickingList);

      // Generate shipping label
      const shippingLabel = await this.generateShippingLabel(order);

      // Update order with tracking
      await Order.findByIdAndUpdate(orderId, {
        fulfillment: {
          pickingList,
          shippingLabel,
          status: this.statuses.PACKED
        }
      });

      // Send confirmation to customer
      await this.sendFulfillmentNotification(order);

    } catch (error) {
      await this.handleFulfillmentError(orderId, error);
    }
  }

  async generatePickingList(order) {
    return {
      orderId: order._id,
      items: order.items.map(item => ({
        sku: item.sku,
        name: item.name,
        quantity: item.quantity,
        location: item.warehouseLocation,
        notes: item.specialInstructions
      })),
      priority: this.calculatePriority(order),
      packingInstructions: this.getPackingInstructions(order)
    };
  }

  async generateShippingLabel(order) {
    const carrier = this.selectCarrier(order);
    
    switch(carrier) {
      case 'ups':
        return this.generateUPSLabel(order);
      case 'fedex':
        return this.generateFedExLabel(order);
      case 'dhl':
        return this.generateDHLLabel(order);
      default:
        return this.generateDefaultLabel(order);
    }
  }

  selectCarrier(order) {
    // Logic to select best carrier based on:
    // - Destination
    // - Package size/weight
    // - Delivery speed requirement
    // - Cost

    const weight = order.items.reduce((total, item) => 
      total + (item.weight * item.quantity), 0
    );

    if (order.shipping.express) {
      return weight > 10 ? 'fedex' : 'ups';
    }

    if (order.shipping.international) {
      return 'dhl';
    }

    return 'ups';
  }

  async trackShipment(trackingNumber, carrier) {
    const tracking = {
      ups: () => this.trackUPS(trackingNumber),
      fedex: () => this.trackFedEx(trackingNumber),
      dhl: () => this.trackDHL(trackingNumber)
    };

    return tracking[carrier]();
  }

  // Dropshipping integration
  async processDropshipOrder(order) {
    const suppliers = this.groupItemsBySupplier(order.items);

    for (const [supplierId, items] of Object.entries(suppliers)) {
      const supplier = await Supplier.findById(supplierId);
      
      // Send order to supplier
      const response = await this.sendToSupplier(supplier, {
        orderId: order._id,
        items,
        shipping: order.shipping,
        customer: order.customer
      });

      // Store supplier order reference
      await SupplierOrder.create({
        orderId: order._id,
        supplierId,
        supplierOrderId: response.orderId,
        items,
        status: 'sent'
      });
    }
  }
}

📊 Analytics & Conversion Optimization

1. E-commerce Analytics Dashboard

// Analytics tracking
class EcommerceAnalytics {
  constructor() {
    this.ga4 = new GA4Client();
    this.pixel = new FacebookPixel();
    this.analytics = new SegmentAnalytics();
  }

  // Enhanced e-commerce tracking
  trackProductView(product) {
    // Google Analytics 4
    this.ga4.track('view_item', {
      currency: 'ILS',
      value: product.price,
      items: [{
        item_id: product.sku,
        item_name: product.name,
        item_category: product.category,
        item_brand: product.brand,
        price: product.price,
        quantity: 1
      }]
    });

    // Facebook Pixel
    this.pixel.track('ViewContent', {
      content_name: product.name,
      content_category: product.category,
      content_ids: [product.sku],
      content_type: 'product',
      value: product.price,
      currency: 'ILS'
    });
  }

  trackAddToCart(product, quantity) {
    // GA4
    this.ga4.track('add_to_cart', {
      currency: 'ILS',
      value: product.price * quantity,
      items: [{
        item_id: product.sku,
        item_name: product.name,
        item_category: product.category,
        item_brand: product.brand,
        price: product.price,
        quantity
      }]
    });

    // Facebook Pixel
    this.pixel.track('AddToCart', {
      content_name: product.name,
      content_ids: [product.sku],
      content_type: 'product',
      value: product.price * quantity,
      currency: 'ILS'
    });

    // Custom metrics
    this.trackCustomMetric('cart_value', product.price * quantity);
  }

  trackPurchase(order) {
    // GA4 
    this.ga4.track('purchase', {
      transaction_id: order.id,
      value: order.total,
      tax: order.tax,
      shipping: order.shipping,
      currency: 'ILS',
      items: order.items.map(item => ({
        item_id: item.sku,
        item_name: item.name,
        item_category: item.category,
        item_brand: item.brand,
        price: item.price,
        quantity: item.quantity
      }))
    });

    // Facebook Pixel with advanced matching
    this.pixel.track('Purchase', {
      value: order.total,
      currency: 'ILS',
      contents: order.items.map(item => ({
        slug: item.sku,
        quantity: item.quantity
      })),
      content_type: 'product',
      num_items: order.items.length
    }, {
      em: this.hashEmail(order.customer.email),
      fn: this.hashData(order.customer.firstName),
      ln: this.hashData(order.customer.lastName),
      ph: this.hashPhone(order.customer.phone),
      ct: this.hashData(order.customer.city),
      zp: order.customer.postalCode
    });

    // Revenue tracking
    this.trackRevenue(order);
  }

  // Conversion funnel tracking
  trackFunnelStep(step, data) {
    const funnelSteps = {
      'product_view': 1,
      'add_to_cart': 2,
      'checkout_start': 3,
      'shipping_info': 4,
      'payment_info': 5,
      'purchase': 6
    };

    this.analytics.track('Funnel Step Completed', {
      step: funnelSteps[step],
      stepName: step,
      ...data
    });
  }

  // A/B testing
  getVariant(experimentId) {
    const variants = ['control', 'variant_a', 'variant_b'];
    const userId = this.getUserId();
    const hash = this.hashCode(userId + experimentId);
    const variant = variants[hash % variants.length];

    this.analytics.track('Experiment Viewed', {
      experimentId,
      variant,
      userId
    });

    return variant;
  }

  // Custom dashboard metrics
  async getDashboardMetrics(dateRange) {
    const metrics = await Promise.all([
      this.getRevenue(dateRange),
      this.getConversionRate(dateRange),
      this.getAverageOrderValue(dateRange),
      this.getCartAbandonment(dateRange),
      this.getTopProducts(dateRange),
      this.getCustomerLifetimeValue(dateRange)
    ]);

    return {
      revenue: metrics[0],
      conversionRate: metrics[1],
      aov: metrics[2],
      cartAbandonment: metrics[3],
      topProducts: metrics[4],
      clv: metrics[5]
    };
  }
}

2. Conversion Rate Optimization

// CRO tools and techniques
class ConversionOptimizer {
  constructor() {
    this.experiments = new Map();
  }

  // Exit intent popup
  initExitIntent() {
    let hasShown = false;

    document.addEventListener('mouseout', (e) => {
      if (e.clientY <= 0 && !hasShown) {
        hasShown = true;
        this.showExitPopup();
      }
    });
  }

  showExitPopup() {
    const popup = document.createElement('div');
    popup.className = 'exit-popup';
    popup.innerHTML = `
      <div class="exit-popup-content">
        <button class="close-btn">&times;</button>
        <h2>Wait! Don't leave yet!</h2>
        <p>Get 10% off your first order</p>
        <form class="exit-popup-form">
          <input type="email" placeholder="Enter your email" required>
          <button type="submit">Get My Discount</button>
        </form>
      </div>
    `;

    document.body.appendChild(popup);

    // Track popup shown
    analytics.track('Exit Intent Popup Shown');

    popup.querySelector('.close-btn').addEventListener('click', () => {
      popup.remove();
      analytics.track('Exit Intent Popup Closed');
    });

    popup.querySelector('form').addEventListener('submit', async (e) => {
      e.preventDefault();
      const email = e.target.querySelector('input').value;
      
      // Save email and generate discount
      await this.saveExitIntentLead(email);
      
      analytics.track('Exit Intent Email Captured', { email });
      
      // Show success message
      popup.querySelector('.exit-popup-content').innerHTML = `
        <h2>Success!</h2>
        <p>Check your email for your discount code</p>
      `;

      setTimeout(() => popup.remove(), 3000);
    });
  }

  // Urgency and scarcity
  showUrgencyIndicators(product) {
    const indicators = [];

    // Low stock
    if (product.inventory < 10) {
      indicators.push({
        type: 'stock',
        message: `Only ${product.inventory} left in stock!`,
        icon: '🔥'
      });
    }

    // Limited time offer
    if (product.saleEndDate) {
      const hoursLeft = Math.floor(
        (new Date(product.saleEndDate) - new Date()) / (1000 * 60 * 60)
      );
      
      if (hoursLeft < 48) {
        indicators.push({
          type: 'time',
          message: `Sale ends in ${hoursLeft} hours!`,
          icon: '⏰'
        });
      }
    }

    // Social proof
    if (product.viewsToday > 50) {
      indicators.push({
        type: 'social',
        message: `${product.viewsToday} people viewed this today`,
        icon: '👀'
      });
    }

    return indicators;
  }

  // Personalized recommendations
  async getPersonalizedRecommendations(userId) {
    const userHistory = await this.getUserHistory(userId);
    const preferences = this.analyzePreferences(userHistory);

    // Collaborative filtering
    const similarUsers = await this.findSimilarUsers(userId, preferences);
    const collaborativeRecs = await this.getCollaborativeRecommendations(similarUsers);

    // Content-based filtering  
    const contentRecs = await this.getContentBasedRecommendations(preferences);

    // Hybrid approach
    return this.mergeRecommendations(collaborativeRecs, contentRecs);
  }

  // Cart abandonment recovery
  async recoverAbandonedCart(cartId) {
    const cart = await Cart.findById(cartId);
    
    if (!cart || cart.status !== 'abandoned') return;

    const timeSinceAbandoned = Date.now() - cart.updatedAt;
    
    // Email sequence
    if (timeSinceAbandoned > 60 * 60 * 1000) { // 1 hour
      await this.sendAbandonmentEmail(cart, 'reminder');
    }
    
    if (timeSinceAbandoned > 24 * 60 * 60 * 1000) { // 24 hours
      await this.sendAbandonmentEmail(cart, 'discount');
    }
    
    if (timeSinceAbandoned > 72 * 60 * 60 * 1000) { // 72 hours
      await this.sendAbandonmentEmail(cart, 'last_chance');
    }
  }
}

🔒 Security & Compliance

1. PCI DSS Compliance

// PCI compliant payment handling
class PCICompliantPayment {
  constructor() {
    this.tokenizer = new PaymentTokenizer();
    this.vault = new SecureVault();
  }

  // Never store raw card data
  async processCardPayment(cardData) {
    // Tokenize immediately
    const token = await this.tokenizer.tokenize(cardData);
    
    // Clear sensitive data from memory
    cardData = null;
    
    // Process with token only
    return this.processWithToken(token);
  }

  // Secure vault for tokens
  async storePaymentMethod(customerId, token) {
    const encrypted = await this.encrypt(token);
    
    await this.vault.store({
      customerId,
      token: encrypted,
      fingerprint: this.generateFingerprint(token),
      expiresAt: Date.now() + (365 * 24 * 60 * 60 * 1000) // 1 year
    });
  }

  // Data encryption
  encrypt(data) {
    const algorithm = 'aes-256-gcm';
    const key = Buffer.from(process.env.ENCRYPTION_KEY, 'hex');
    const iv = crypto.randomBytes(16);
    
    const cipher = crypto.createCipheriv(algorithm, key, iv);
    
    let encrypted = cipher.update(JSON.stringify(data), 'utf8', 'hex');
    encrypted += cipher.final('hex');
    
    const authTag = cipher.getAuthTag();
    
    return {
      encrypted,
      iv: iv.toString('hex'),
      authTag: authTag.toString('hex')
    };
  }

  // Audit logging
  async logPaymentEvent(event, data) {
    await AuditLog.create({
      event,
      timestamp: new Date(),
      userId: data.userId,
      ip: data.ip,
      userAgent: data.userAgent,
      // Never log sensitive data
      metadata: this.sanitizeForLogging(data)
    });
  }

  sanitizeForLogging(data) {
    const sanitized = { ...data };
    
    // Remove sensitive fields
    delete sanitized.cardNumber;
    delete sanitized.cvv;
    delete sanitized.token;
    
    // Mask if present
    if (sanitized.email) {
      sanitized.email = this.maskEmail(sanitized.email);
    }
    
    return sanitized;
  }
}

2. Fraud Detection

// Fraud detection system
class FraudDetection {
  constructor() {
    this.riskThreshold = 70; // Risk score threshold
    this.mlModel = new FraudMLModel();
  }

  async assessTransaction(order) {
    const riskFactors = [];
    let riskScore = 0;

    // Velocity checks
    const velocity = await this.checkVelocity(order);
    if (velocity.suspicious) {
      riskScore += 30;
      riskFactors.push('High transaction velocity');
    }

    // Geographic checks
    const geoRisk = await this.checkGeographic(order);
    if (geoRisk.mismatch) {
      riskScore += 25;
      riskFactors.push('Geographic mismatch');
    }

    // Device fingerprinting
    const deviceRisk = await this.checkDevice(order);
    if (deviceRisk.suspicious) {
      riskScore += 20;
      riskFactors.push('Suspicious device');
    }

    // Email analysis
    const emailRisk = this.analyzeEmail(order.email);
    if (emailRisk.suspicious) {
      riskScore += 15;
      riskFactors.push('Suspicious email');
    }

    // ML model prediction
    const mlPrediction = await this.mlModel.predict(order);
    riskScore += mlPrediction.riskScore * 50;

    // Determine action
    let action = 'approve';
    if (riskScore >= this.riskThreshold) {
      action = riskScore >= 90 ? 'decline' : 'review';
    }

    return {
      score: riskScore,
      factors: riskFactors,
      action,
      requiresVerification: riskScore >= 50
    };
  }

  async checkVelocity(order) {
    const timeWindow = 24 * 60 * 60 * 1000; // 24 hours
    
    // Check by email
    const emailOrders = await Order.countDocuments({
      'customer.email': order.customer.email,
      createdAt: { $gte: new Date(Date.now() - timeWindow) }
    });

    // Check by card fingerprint
    const cardOrders = await Order.countDocuments({
      'payment.fingerprint': order.payment.fingerprint,
      createdAt: { $gte: new Date(Date.now() - timeWindow) }
    });

    return {
      suspicious: emailOrders > 5 || cardOrders > 3,
      emailCount: emailOrders,
      cardCount: cardOrders
    };
  }

  async checkGeographic(order) {
    const ipLocation = await this.getIPLocation(order.ip);
    const distance = this.calculateDistance(
      ipLocation,
      order.shipping.coordinates
    );

    return {
      mismatch: distance > 1000, // More than 1000km
      distance,
      ipCountry: ipLocation.country,
      shippingCountry: order.shipping.country
    };
  }

  analyzeEmail(email) {
    const suspicious = {
      disposable: this.isDisposableEmail(email),
      newDomain: this.isNewDomain(email),
      typicalPattern: this.hasTypicalFraudPattern(email)
    };

    return {
      suspicious: Object.values(suspicious).some(v => v),
      ...suspicious
    };
  }
}

✅ E-commerce Checklist

Platform & Infrastructure:

• Choose appropriate platform
• Set up hosting/cloud infrastructure
• Configure CDN
• Implement caching strategy
• Set up monitoring & alerts
• Configure backups

Product Management:

• Product catalog structure
• Variant management
• Inventory tracking
• Price management
• Product search & filters
• Product recommendations

Shopping Experience:

• Shopping cart functionality
• Wishlist/favorites
• Product comparisons
• Quick view
• Size guides
• Product reviews

Checkout & Payment:

• Multi-step checkout
• Guest checkout
• Express checkout
• Multiple payment methods
• Payment security (PCI)
• Order confirmation

Shipping & Fulfillment:

• Shipping calculations
• Multiple shipping methods
• Order tracking
• Inventory management
• Return management
• Dropshipping integration

Marketing & SEO:

• SEO optimization
• Email marketing integration
• Social media integration
• Discount/coupon system
• Affiliate program
• Product feeds

Analytics & Optimization:

• Google Analytics 4
• Facebook Pixel
• Conversion tracking
• A/B testing
• Heat maps
• Performance monitoring

Security & Compliance:

• SSL certificate
• PCI compliance
• GDPR compliance
• Fraud detection
• Secure payment processing
• Data encryption

Customer Service:

• Live chat
• FAQ section
• Return policy
• Contact forms
• Order status page
• Customer accounts

🚀 סיכום והמלצות

Quick Wins לשיפור מיידי:

1. הוסף Express Checkout - 40% יותר המרות
2. הטמע Reviews - 35% יותר אמון
3. Exit Intent Popups - 15% פחות נטישה
4. Free Shipping Bar - 30% יותר AOV
5. Mobile Optimization - 50% מהקניות

אסטרטגיה לטווח ארוך:

1. Personalization - המלצות מותאמות אישית
2. Subscription Model - הכנסה חוזרת
3. Marketplace - מכירה דרך ערוצים נוספים
4. International Expansion - שווקים חדשים
5. AI Integration - chatbots, visual search

המפתח להצלחה: חוויית משתמש מעולה + אופטימיזציה מתמדת = מכירות! 🎯💰