asrvd / cloudinary-examples

Easy Cloudinary integration examples for boosting web performance.

Cloudinary Examples

Learn how to easily integrate Cloudinary into your projects with real examples.

• Android
• Flutter
• HTML & Browser
• iOS
• Kotlin
• Netlify
• Next.js
• Node.js
• React
• Remix
• SolidJS
• Svelte
• Vue
• .NET
• Dart

🧰 Examples

Android

• ImageView

Flutter

• CldImageWidget

HTML & Browser

• Client Hints

iOS

• CLDUIImageView

Kotlin

• ImageView

Netlify

• Netlify Function - Cloudinary Custom Remote Function
• Netlify Function - Cloudinary Webhook Endpoint
• Netlify Graph Authentication - Cloudinary Auth in Netlify Function

Next.js

• Cloudinary Upload Widget with Signed Uploads
• Cloudinary Upload Widget with an Upload Preset (Unsigned)
• Next Cloudinary - CldImage Component
• Next Cloudinary - CldOgImage Component
• Next Cloudinary - CldUploadButton Component
• Next Cloudinary - CldUploadWidget Component
• Next.js Image Component - Cloudinary Loader
• Next.js Image Component - Cloudinary URLs
• Social Media Card
• Upload Files from FormData in API Routes

Node.js

• Cloudinary Transformations & Effects
• Eval on Upload
• Social Media Card
• Upload Images
• Upload Videos

React

• Cloudinary AdvancedImage Component
• Cloudinary AdvancedVideo Component
• Cloudinary Product Gallery
• Cloudinary Transformations & Effects
• Cloudinary Upload Widget
• Cloudinary Video Player

with Typescript

• Cloudinary Media Library

Remix

• Cloudinary Upload Widget with an Upload Preset (Unsigned)

SolidJS

• Cloudinary Transformations & Effects
• Cloudinary Upload Widget with an Upload Preset (Unsigned)

Svelte

• Cloudinary Image Upload (Server)
• Cloudinary Transformations & Effects
• Cloudinary Upload Widget with an Upload Preset (Unsigned)
• Svelte Cloudinary - CldImage Component

Vue

• Cloudinary AdvancedImage Component
• Cloudinary Upload Widget with an Upload Preset (Unsigned)

.NET

• Upload Images
• Upload Videos

Dart

• Upload Images

🧐 Not seeing an example?

Create an issue detailing the project and how Cloudinary would integrate.

If the use case seems like it would be broadly helpful for others as well, I'll try to work it into this repository!

🛠️ Contributing

Each project is independently maintained, though uses yarn workspaces for dependency management.

To create a new example, first check if an existing example is avaiable for the given framework. If so, it's recommended to copy the directory for your new example to maintain consistency between the examples.

If no existing example exists, you can create a new directory that includes the basic example.

All examples should be minimal with as little dependencies as needed (ideally no additional dependencies).

✨ Contributors

Thanks goes to these wonderful people (emoji key):

Colby Fayock 💻 📖	Matías Hernández Arellano 💻	Kevin Cunningham 💻	Tim Benniks 💻	Lazar Nikolov 💻	adimiz1 💻	Andrew Rowley 💻
Soumya Ranjan Mohanty 💻	Hiren Chauhan 💻	Lucas Minter 💻	Kobe Ruado 💻	Aditya Oberai 💻	Rahul Jain 💻	Kelden 💻
saisumith 💻	Aazam Thakur 💻	Soumyadip Moni 💻	Syed Talal Jilani 💻	sccalabr 💻	ProCodec 💻	Joshua Olorunnipa 💻
James P 💻

This project follows the all-contributors specification. Contributions of any kind welcome!