Gatsby is a React.js-based web framework that allows developers to easily pull together different content, APIs, and services into a single data layer.
Cloudinary works complementary with Gatsby allowing developers to have access to their Cloudinary assets, transform images, and more easily work with them in the data graph.
Using Cloudinary with Gatsby
There are a few options for getting started with using Cloudinary in Gatsby
Gatsby Source Cloudinary
Gatsby Transformer Cloudinary is a community-built solution for pulling Cloudinary resource data into the Gatsby data layer.
> Important: Community-developed libraries are developed, tested and maintained by the community. Bug fixes and feature requests should be submitted in the relevant repository.
For more information on installation and how to configure the plugin in your Gatsby project, visit the documentation at:
https://github.com/cloudinary-devs/gatsby-source-cloudinary
Gatsby Transformer Cloudinary
Gatsby Transformer Cloudinary is a community-built solution for delivering Cloudinary resources, adding local and remote assets, and adding transformations with support from the Gatsby Image component.
> Important: Community-developed libraries are developed, tested and maintained by the community. Bug fixes and feature requests should be submitted in the relevant repository.
For more information on installation and how to configure the plugin for different use cases in your Gatsby project, visit the documentation at:
https://github.com/cloudinary-devs/gatsby-transformer-cloudinary
Cloudinary React SDK
Gatsby is built on top of React.js which allows you to use the Cloudinary React SDK.
Learn more about the available components, widgets, and tools on the Cloudinary docs: https://cloudinary.com/documentation/react_integration
Or find examples on GitHub: https://github.com/colbyfayock/cloudinary-examples#react
More Resources
Learn more about how to use Cloudinary with Gatsby: