what is Cloudinary

Cloudinary is a cloud-based media management platform that provides a wide range of features for uploading, storing, managing, manipulating, and delivering digital media, including images, videos, and audio files. It offers a scalable and reliable solution for businesses and developers to optimize their media management workflows, improve user experience, and reduce costs.

Some of the key features of Cloudinary include:

• Automatic image and video optimization for faster loading times and better performance
• Advanced image and video manipulation capabilities, such as resizing, cropping, and adding watermarks
• Media metadata management and tagging
• Automatic format selection and optimization based on the end-user's device and network conditions
• Content delivery network (CDN) integration for faster content delivery and global scalability
• Media analytics and reporting to help businesses understand how their media is being used and consumed

Core concepts

• Dashboard - When you create an account on cloudinary, you will see Product Environment Credentials in dashboard. You can find cloud name, api key and api secret. You can also see current plan and usage here.
• Media Library - Here you can see all your media assets like images and videos. You can download, upload, get links to files over here.
• Transformations - You can see various transformations here. e.g. resizing, scaling, rotating, converting image format, cropping, generate photo collage online, adding text, round corners, borders, use image as text textures, convert pdf to jpg, adding watermark

Settings

• upload settings - ml_default is the upload preset that is auto generated for you. Upload preset has signed or undsigned mode, public id, delivery type and access mode. You can create multiple upload presets
• Security settings - You can disable strict transformations meaning on the fly transformations will be disabled. You can also allow strict referral domain. You can also whitelist ip and fetch domains. You can also enable PDF and ZIP files here.
• Users - You can add users and groups to access cloudinary account.

Uploading

• Uploading can be done in 2 ways - UI or API
• Cloudinary also provides upload widget that can be used
• Uploads can be signed(cloud_name, api_key and api_secret) or unsigned (cloud_name).
• SDKs in various languages are available but you can directly hit cloudinary api as well
• upload type can be public, authenticated or private
• upload type can be public, private (derived versions can be accessed) or authenticated (Assets can be accessed only via some kind of authentication).
• resource type can be video, image, raw or auto

cloudinary.v2.uploader.upload(file, options).then(callback);

//You can also upload from remote url
cloudinary.v2.uploader
.upload("https://www.example.com/sample.jpg")
.then(result=>console.log(result));

Transformations

• You can do on the fly transformations using syntax "https://res.cloudinary.com/<cloud_name>/<asset_type>/<delivery_type>///<public_id>." But make sure that strict transformations are disabled

• You can use image or url method for transformations

cloudinary.image("xyz.jpg", {transformation: [
  {gravity: "face", height: 400, width: 400, crop: "crop"},
  {radius: "max"},
  {width: 200, crop: "scale"}
  ]})

  cloudinary.url("sample.jpg", {background: "blue", height: 300, width: 300, crop: "pad"})

API and SDKs

• API endpoint to upload image are https://api.cloudinary.com/v1_1//<resource_type>/upload e.g. https://api.cloudinary.com/v1_1/demo/image/upload

• Required params for signed upload - file, api_key, timestamp, signature

• Required params for unsigned upload - file and upload_preset

• Nodejs api docs - https://cloudinary.com/documentation/node_integration and https://cloudinary.com/documentation/node_quickstart

• React docs - https://cloudinary.com/documentation/react_quick_start and https://cloudinary.com/documentation/react_integration

• Collage - https://cloudinary.com/documentation/image_upload_api_reference#create_collage

Restricting access using signed urls, cookies and tokens

Plans

• There are 3 plans - free, advanced and advanced extra
• In free plan, you get 25 credits (1 Credit = 1,000 Transformations OR 1 GB Storage OR 1 GB Bandwidth)