- You will need to install Node.js on your machine, version 10 or higher.
- Installing Node.js will also install npm, the package manager for Node.js.
🍺 Using Homebrew:
$ brew install node
$ node --version
v18.18.1
$ npm --version
9.8.1
- Visual Studio Code (Recommended)
- WebStorm
- Sublime
- Atom
- iTerm
- Node scripts for this module are located in the
/moderation
,/foldering
,/transformations
,/upload
/upload-presets
,/upload-widget
and/transformations
directories - Assets are located in
/assets
directory - Run code from root directory
-
If you don't have one already, create a free Cloudinary account at: https://www.cloudinary.com/signup.
-
Navigate to the Dashboard. Copy the
CLOUDINARY_URL
into your clipboard (see yellow arrow).
- Create a
.env
file in the root of the project. Paste the CLOUDINARY_URL environment variable into your.env
file.
There should be one line of code in your .env file, which should look like this:
CLOUDINARY_URL=cloudinary://YOUR_API_KEY:YOUR_API_SECRET@YOUR_CLOUD_NAME
- Key: CLOUDINARY_URL
- Value: cloudinary://API_KEY:API_SECRET@CLOUD_NAME
Doing this step properly is essential, as it will let Cloudinary know who you are and provide access to your cloud.
npm i
(You will be using the cloudinary
and the dotenv
libraries.)
node testCredentials.js
The output should look like this:
your Cloud Name
your API Key
- Your API_SECRET is part of your CLOUDINARY_URL
- Remember to always keep your API_SECRET a secret!
- This is why we programmed testCredentials.js to only output your cloud name and API Key (no need to keep these two credentials private)
node upload/local-upload.js
(You can optionally run the local image upload script to make sure you see the asset appear in your cloud)
There is an accompanying slide deck that will walk you through the following topics related to UGC.
- First we review where one might see UGC in the wild
- Then, in the context of a food delivery app, we discuss ways Cloudinary can help with the management of said UGC
- Marketplace
- Social/Dating
- Travel
- E-Commerce
- Incoming Transformations
- Upload Presets
- Upload Widget
- File Size
- Storage and Folders
- Analysis on Upload
- Moderation
- AI Content Analysis - Tagging, Cropping
- Quality Analysis
- Media Flows
- Cloudinary Academy and Community
- Incoming Transformations:
transformations/incoming-transformations.js
- Upload Presets:
upload-presets/create-upload-preset.js
upload-presets/create-derived-image-preset.js
upload-presets/upload-using-preset.js
upload-presets/upload-and-transform-asset.js
- Upload Widget:
upload-widget/index.html
- File Size:
transformations/resize.js
- Storage and Folders:
foldering/specify-location.js
- Analysis on Upload
- Image Moderation
moderation/image-moderation/upload-moderation-expect-approval.js
moderation/image-moderation/upload-moderation-expect-reject.js
- Video Moderation
moderation/video-moderation/upload-auth-expect-approval.js
moderation/video-moderation/upload-auth-expect-reject.js
- AI Content Analysis - Tagging, cropping, quality score, eval parameter
content-analysis/gravity-detection-cropping.js
content-analysis/upload-with-tags.js
content-analysis/upload-with-quality-analysis.js
- Image Moderation
- Upload Presets Docs
- AI Content Analysis Docs
- Supported content-aware detection models
- Object detection demo app
- Resizing and cropping interactive demo
- Upload Presets Video Tutorial - walks you through the steps of creating signed upload presets using the Admin API.
- Upload Programmatically Video Tutorial - covers Node.js setup and upload to your Cloudinary cloud.
- Upload Widget Video Tutorial - how to get started with Cloudinary's Upload Widget.
- Documentation - Evaluating and Moderating Upload Parameters - eval
- Add-Ons
-
janedoe.jpg: Photo by Andrea Piacquadio from Pexels
-
baby.jpg: Photo by Ganimat Pashazade from Pexels
-
uno-cig.jpg: Photo by Pavel Danilyuk from Pexels
-
cheeseburger.jpg: Photo by Valeria Boltneva from Pexels
-
koala.jpg: Video by Valeriia Miller from Pexels
-
hot-tub.mp4: Video by Ron Lach from Pexels