Last updated: Aug-15-2023
Learn how to install and configure the Cloudinary Vue.js SDK in your Vue.js environment.
This tutorial presents the following topics. Click a timestamp to jump to that part of the video.
|0:05||The Cloudinary Vue.js SDK provides transformation, optimization, and delivery capabilities that you can implement using code that integrates seamlessly with your existing Vue.js application.|
|0:18||To install the Vue.js SDK, in a terminal run:|
|1:17||To configure the SDK for your product environment, you can set your cloud name (in addition to other configuration parameters) in a new instance of
|2:18||You can create a generic image component for your app, which takes a public ID as a parameter, by moving all the code to a component (in this case, CloudImage.vue) and importing the component to App.vue, making the component generic by defining props:|
Find Your CredentialsLearn how to find your cloud name, API key and API secret
Using the Nuxt Image ComponentDeliver images using the Nuxt Image component
Named TransformationsSimplify & standardize complex delivery URLs
Check out the Cloudinary Academy for free self-paced Cloudinary courses on a variety of developer or DAM topics, or register for formal instructor-led courses, either virtual or on-site.