Serverless Media for Netlify CMS
Netlify CMS and Git Workflow
Netlify CMS is an open source CMS for your Git workflow. It enables you to provide content editors with a friendly UI and intuitive user experience.
Your content gets stored in a Git repository alongside your code for easier versioning, multi-channel publishing, and the option to handle content updates directly in Git. You can use Netlify CMS with any static site generator like Jekyll or Hugo to create faster, more flexible web projects.
Git as Media Storage
While storing files in a Git repo can be a solid workflow, some issues exist:
- Storing too many binary files or simply huge files can lead to long waits needed to clone the repository.
- When handling images, only include the ones you need in the repo. Stick with original image versions (not their derivatives) and carefully choose which ones to keep and which to drop.
Using Git repository is hard to scale, especially when it gets to receiving user-generated media. Uploadcare integration helps you detach file infrastructure routines at scale from your Netlify workflow.
As an end-to-end file handling platform, we handle content uploads, storage, optimization, and CDN delivery. Every file on Uploadcare immediately gets to our smart storage and is cached by our CDN to be further rapidly and reliably delivered across 220k servers in 130+ countries.
Once your files are on Uploadcare, you then operate with either their CDN URLs or UUIDs:
Combined with our media processing engine that is especially useful for image content which can be transformed on the fly by including URL directives. Hence, you can store original CDN URLs in a Git repository, while all the derivatives will be generated whenever you need them.
Integrating Uploadcare into Netlify CMS
Integrating Uploadcare File Uploader into Netlify CMS is quick and here’s how you do it:
- Make sure you’re using Netlify CMS 2.1.0+, upgrade if necessary.
- Create an Uploadcare account.
- Define a target project for uploads by discovering its API key.
- Remove the
media_folderproperty from your CMS configuration file.
- Add the following to your CMS configuration file:
media_library: name: uploadcare config: publicKey: YOUR_PUBLIC_KEYruby
YOUR_PUBLIC_KEY with your public API key.
That’s it; you can now add media to your content via Uploadcare File Uploader in the admin panel of your Netlify website. There’s no need to push any files to your repo anymore: they now go to the Uploadcare storage and get delivered from our CDN.
On-the-fly Image Transformations
In case you want to edit any image on Uploadcare, you don’t have to upload its updated version. We handle Image Transformations on the fly via URL directives. Just include the supported ones in your image CDN URLs.
That’s it! In case you want to learn more, check out the Netlify CMS docs on integrating Uploadcare.