Cloudinary Jumpstart

Cloudinary Jumpstart - Introduction to Cloudinary Using Node.

You'll learn the basics of how to get configured and started as a Cloudinary developer.

Topics:

• Environment Setup and Account Identifiers
• Uploading Basics
• Cloudinary URL Builder
• Transformation and Delivery (Resize, Crop, Optimize)
• Further Support

Environment Setup

Install Node.js and NPM

You will need to install Node.js on your machine. Download Node

Important - Installing Node.js will also install npm, the package manager for Node.js.

Mac Users

Using Homebrew:

brew install node

Windows

Using Chocolatey

choco install nvs

Verify Node/NPM install

# verify versions
$ node --version
v19.2.0

$ npm --version
8.19.3

Choose an IDE or Use Text Editor

• Visual Studio Code We recommend VS Code
• WebStorm
• Sublime
• Atom
• iTerm

Download Repository

Cloudinary Jumpstart

Checkout a local copy of the repository using the following command in a command line terminal on your computer:

git clone https://github.com/cloudinary-training/cld-jumpstart.git

• Assets are located in /assets directory
• Run scripts from the cld-jumpstart directory you have checked out. All references to local assets are relative to the root of the repository.

Credentials

1. Create a free account on Cloudinary at [https://www.cloudinary.com/signup]

2. Navigate to the Dashboard. Copy the CLOUDINARY_URL into your clipboard.

• Key: CLOUDINARY_URL
• Value: cloudinary://API_KEY:API_SECRET@CLOUD_NAME

3. Create a .env file in the root of the project. Paste the CLOUDINARY_URL environment variable into your .env file.

Libraries

You will be using the cloudinary and the dotenv libraries.

Install Cloudinary

npm install cloudinary

Install dotenv

npm install dotenv 

In config.js and all other node scripts, you'll see

require('dotenv').config();
const cloudinary = require('cloudinary').v2;

Run Code: Test Credentials (config.js)

Make sure to npm install the Node.js libraries. You will be using the cloudinary and the dotenv libraries.

npm i

Run Code: config.js

node config.js

You should see your Cloud Name and API Key output in this format:

****Set up and configure the SDK:****
 cloud_name
 api_key 

PS- Always keep your API_Secret private!

Run Code

Basic Upload Method:

• Local

node local-upload.js

• Remote

node remote-upload.js

• Public ID Naming Options

node public-id.js

• Specify Resource Type

node resource-type.js

URL Builder:

• Retrieve Cloud Name from CLOUDINARY_URL

node cloudinary-url.js

• Supply Cloud Name in Code

node cloudinary-url-without-env.js

Basic transformations:

• resize

node resize.js

• fill crop with gravity

node crop.js

Basic optimizations:

• automatic format

node format-auto.js

• automatic quality

node quality-auto.js

• both (f_auto, q_auto)

node optimize.js

Introduction to Cloudinary for API Users and Node.js Developers

If you'd like to learn more than the basics of getting started with Cloudinary, please do check out our course: Introduction to Cloudinary for API Users and Node.js Developers, and its associated repository

To learn even more, head to the Cloudinary Academy

Credits

assets/images

hiker.jpg - Photo by Edou Hoekstra from Pexels

glacier.mp4 - Photo by Jan Zakelj from Pexels

surfer.jpg - Wikimedia

y2kbug.ttf - Public TrueType Font File, Y2K Bug, from All-free-download.com