Cloudinary Documentation

### Cloudinary Image Upload and Transformation Guide

**Task:** Upload images to Cloudinary and apply transformations for a React-based e-commerce platform.

#### 1. Setup Cloudinary Account
- Sign up at [Cloudinary](https://cloudinary.com) and note your `cloud_name`, `api_key`, and `api_secret`.

#### 2. Install SDK
```bash
npm install cloudinary-react cloudinary
```

#### 3. Upload Images
```javascript
import { CloudinaryImage } from '@cloudinary/react';
import { Cloudinary } from '@cloudinary/url-gen';

const cld = new Cloudinary({
  cloud: {
    cloudName: 'your_cloud_name'
  }
});

const myImage = cld.image('sample.jpg');
myImage.resize('c_limit,w_500,h_500').format('auto');
```

#### 4. Best Practices
- Use **unsigned uploads** for client-side uploads (requires `upload_preset`).
- Optimize transformations with **chained operations** (e.g., `resize().format().quality('auto')`).
- Cache transformed assets using **Cloudinary’s CDN**.

#### 5. Error Handling
- Handle upload errors with try-catch blocks:
```javascript
try {
  const uploadResult = await cld.uploader.upload('image.jpg');
} catch (error) {
  console.error('Upload failed:', error);
}
```