This project contains SDKs designed to work with Cloudinary url-gen. These SDKs render CloudinaryImage or CloudinaryVideo objects into the DOM.
Each SDK also contains advanced features in the form of plugins, which extend the native HTMLImage and HTMLVideo elements.
To build and link project:
To get started, install the npm client package of your choice along with our base package. For example, to use Cloudinary in a React environment, the following packages should be installed:
npm i @cloudinary/react @cloudinary/url-gen
Note: To use Angular install @cloudinary/ng
.
The following is a simple example using React. For more information on React and other frameworks, navigate to the specific reference using the Packages menu.
import React from 'react'
// Cloudinary is used to configure your account and generate urls for your media assets
import {Cloudinary} from "@cloudinary/url-gen";
// Import the cloudinary media component (AdvancedImage / AdvancedVideo),
// and the plugins you want to use.
import {AdvancedImage, accessibility, responsive} from '@cloudinary/react';
// Once per project/app - configure your instance.
// See the documentation of @cloudinary/url-gen for more information.
const myCld = new Cloudinary({cloud: {cloudName: 'demo'}});
export const App = () => {
// Create a new image object:
const img = myCld.image('sample');
// Render your component.
return (
<div>
<AdvancedImage cldImg={img} plugins={[responsive(), accessibility()]}/>
</div>
)
};
Repository is using Conventional Commits. To publish packages please read instructions in sdk-scripts.