Netlify is a web development platform that allows for teams to easily build, deploy, and scale high performance applications for the web.
Cloudinary further enables teams to build those applications with images and videos, with close attention to performance with optimization, and an industry-leading DAM for managing media assets.
Using Cloudinary with Netlify
Netlify is relatively agnostic in terms of providing a prescriptive way to build applications, giving teams flexibility in how best to solve working with tools like Cloudinary.
You can primarily think of 3 main integration points: build time, website or application code, and content. Each of these points has its own strength depending on a project’s needs.
Optimizing at Build Time with Netlify Cloudinary
At build time, we can use Netlify Cloudinary, a Netlify integration, which provides blanket image optimization for websites and apps deployed to Netlify. By installing this integration, Cloudinary will automatically replace existing images with Cloudinary-optimized versions to help improve performance and page load size.
This would be considered the most “hands-off” approach, as installing the integration only requires a few clicks, and as such, this provides the least flexibility for being able to take full advantage of Cloudinary features.
Integrating Cloudinary with Language & Framework SDKs
When it comes to integrating Cloudinary with your application stack, Cloudinary provides a wide variety of SDKs as well as community SDKs like Next Cloudinary that bring first class support for working with your assets right inside of your application code.
This will give you the most flexibility out of all of the options for being able to transform and deliver not only images, but also videos, using all of the features Cloudinary has to offer, including being able to upload and manage assets right from your application.
Here are a few SDKs and Community SDKs for some of the most popular tools:
- Next Cloudinary: https://next.cloudinary.dev/
- React SDK: https://cloudinary.com/documentation/react_integration
- JavaScript SDK: https://cloudinary.com/documentation/javascript_integration
- Node.js SDK: https://cloudinary.com/documentation/node_integration
- Gatsby: https://cloudinary.com/guides/front-end-development/integrating-cloudinary-with-gatsby
- Svelte: https://svelte.cloudinary.dev/
- Nuxt: https://cloudinary.nuxtjs.org/
Find more Cloudinary SDKs and community SDKs over on the Cloudinary docs.
Managing Assets in Ecommerce & Content Management Systems
When managing the images and videos that get added to your website or application, typically the bulk of those assets should come from your content management layer. This helps keep all of your content in one place as the source of truth, whether that’s a CMS or ecommerce PIM (Product Information Management).
To ensure you’re able to easily add images and videos to your content layer, Cloudinary works closely with its Technology Partners to provide best-in-class CMS and Ecommerce integrations for your favorite content solutions. This gives you the best of both worlds, managing your assets using the Cloudinary DAM from right inside of your content platform.
For ecommerce, some of the integrations you can find are:
To manage Cloudinary within your content, you can also find integrations for:
And these are just a few of the popular ones. Head over to the Technology Partners page to see all Cloudinary and Partner-Built Integrations.
Is your product not listed? Learn how to build your own integration.
More Resources
Learn more about how to use Cloudinary with Netlify: