-
ReactSDK
-
Description
The Cloudinary React SDK contains components like <AdvancedImage> to easily render your media assets from Cloudinary. The SDK also comes with support for optional JS plugins that make the components smart, with features like lazy loading, placeholder, accessibility & responsiveness.
Examples
Please note that the order of the plugins is important. See Plugin Order for more details.
// Example import {CloudinaryImage} from "@cloudinary/url-gen/assets/CloudinaryImage"; import { AdvancedImage, accessibility, responsive, lazyload, placeholder } from '@cloudinary/react'; const App = () => { const myCld = new Cloudinary({ cloudName: 'demo'}); let img = myCld().image('sample'); return ( <div> <div style={{height: "1000px"}}/> <AdvancedImage cldImg={img} plugins={[lazyload(), responsive(100), placeholder()]} /> </div> ) };Details