Cloudinary

Introduction

Cloudinary is a software solution based on Software-as-a-Service (SaaS). It is primarily used for managing all the media assets present in the cloud. The assets can be anything from the web or mobile application depending on the type. Cloudinary offers a full-fledged solution for all the media assets including image and video needs, upload, administration, optimized delivery, storage, and manipulation. It is handled on Cloudinary servers, which gets automatically scaled-up for handling sudden high loads and frequent traffic bursts.

Moreover, this media asset management process is handled with a medium which is a full-fledged Digital Media Management (DAM). The dynamic user interface of this medium is designed in such a way that both creative designers and developers can carry out their work easily. Alongside, we can manage a comprehensive API that can deliver user-generated and in-house media content by transforming them into your mobile or website with just a few lines of code.

Features of Cloudinary

Cloudinary is a cloud-based Saas solution that powers web or mobile application's entire media management pipeline.

The features are as follows:

1. Easy to migrate images to the cloud. Automatic smart image cropping, resizing and conversion is managed without need to install any software. It can be integrated with Twitter or Facebook for profile picture extraction while figuring out the dimension and style to match our graphics requirements. The delivery of images is seamlessly fast with the help of CDN.
2. Cloudinary offers administrative capacities and supports comprehensive API integration with web apps, be it existing or new.
3. Web development frameworks are easy to integrate because Cloudinary offers HTTP and URL-based API integration.
4. The most used backend platform js is highly compatible with Cloudinary for enhancing very smooth integration.

Environment Setup

To be able to use Cloudinary, we need to have Node.js pre-installed with all the dependencies and libraries. The task of the setup is quite simple. Below commands install Cloudinary in our system efficiently.

After this step, we need to sign up to CDN to try out transformations and conversions seamlessly.

Note: Replace the demo in the all the examples shown below with our own Cloudinary's cloud name.

Accessing the publicly uploaded image through CDN can be done using the link.

Generating a 150x100 resolution image by using conversion through Cloudinary.

Rounding corners to the above image with 20 pixels.

Importing Facebook or Twitter images through Cloudinary using CDN.

Usage

Assuming you have your Cloudinary configuration parameters defined (cloud_name, api_key, api_secret defined via CLOUDINARY_URL configuration variable), uploading to Cloudinary is very simple.

Upload

Uploading images to Cloudinary is quite simple. The example below uploads a local JPG to cloud.

It will assign a randomly generated public ID for the image and it is easily available to download from CDN.

To specify our own public ID, we can assign the parameters as shown below:

The uploaded image is thus assigned with the given sample_remote public ID as shown above. The image is now readily available to download from CDN.

Transforming and Embedding Images

Images uploaded to Cloudinary can be easily embedded and transformed using powerful methods. Examples below are some of the methods.

This example would generate the URL for accessing the uploaded image with the transformation of rectangular fill at 100x50 resolution in terms of width and height.

This example would embed a small version of the uploaded image by generating 90x90 face detection enabled thumbnail.

With the help of the above example, we can provide a numeric ID or Facebook name of any Facebook profile or a page by balancing the absolute graphics.

Same concept of Facebook can be implemented for Twitter using the above example.

Summary

In this tutorial, we learned the very basics of Cloudinary from environment setup to usages of Cloudinary along with various examples. There are yet many things to cover up since Cloudinary has the application on other developmental environments like Ruby on Rails, Facial Recognition image management, etc. Cloudinary is not just a SaaS-based software solution neither it is confined to its use cases. Designers and developers who want continuous integration can take advantage of using Cloudinary for managing their media assets alongside carrying out development through API which would enhance the Cloudinary to a great extend. Cloudinary is highly preferred for such cases where media management turns difficult. Be it a mobile application or a desktop, the media is one of the most important aspects which form the base of any application to manage such huge media assets is not an easy task but Cloudinary makes it very simple.