Cloudinary DevJams

Cloudinary DevJams

By CloudinaryTechnology
Download on the App Store

Cloudinary DevJams episodes

  • Building a Publish Extension for Canva and Cloudinary - DevJams Episode #19

    With Canva being one of the hottest tools for creative and design projects, Cloudinary’s Igor Vorobeychik decided to build out a Canva-Cloudinary connector to help streamline work for those who use both platforms! This allows people to create their design in Canva, then publish it to Cloudinary for delivery onto websites, mobile apps and more.


    Cloudinary’s Customer Education team will be walking through Igor’s Canva Publish Extension to show how he built it, and better understand how to create deep connections between mutually beneficial systems via code. Together, we will dive into his scripts that use Cloudinary’s Node.js SDK, Express, and more.

    Read more about Igor's process in building his Canva-Cloudinary connector on the Cloudinary blog.

    Mentioned Cloudinary Transformations and Features:

    • Environment Variable
    • Admin API Get Subfolders
    • Upload API
    • URL Helper Method

      • Not a Cloudinary user yet? Sign up for your FREE account today!

      1 hr 5 min
    • Image Loading Enhancements with Cloudinary, Tailwind and Base64 Encoding - DevJams Episode #18

      Kent Dodds is one of the foremost experts on JavaScript, authoring helpful blog posts and courses on the widely used programming language. He recently shared some techniques to improve his own blog’s image loading experience, which happens to use Cloudinary for several aspects of it.

      Becky and Sam from Cloudinary’s Customer Education team talked with Kent, walking through the processes he took to get a 100/100 on the "Cumulative Layout Shift" Core Web Vitals score for his blog. This conversation includes reviewing code scripts to understand his use of Tailwind’s aspect-ratio plugin, Cloudinary’s ability to load perfectly sized images and to handle Base64 encoding, and other important topics.

      Learn more about the project on Kent's blog.

      Covered Cloudinary Transformations and Features

      • Resizing and Cropping
      • Automatic quality selection (q_auto)
      • Automatic format selection (f_auto)
      • Blur effects

        • Mentioned Technology and Associated Topics

        • Cumulative Layout Shift (CLS)
        • Aspect Ratio Plugin for Tailwind
        • BlurHash
        • Tailwind CSS

          • Not a Cloudinary user yet? Sign up for your FREE account today!

          1 hr 9 min
        • Retrieving Instagram Content, Delivering with Cloudinary - DevJams Episode #17

          In this Cloudinary DevJams podcast episode, we talk with Joel Turner – Senior Product Engineer at Sprinkr! He demonstrates how he built a Gatsby plugin that uses Cloudinary to serve Instagram content on his blog.

          Our hosts and guest dive into all things open-source, as Joel is actively creating and sharing code on GitHub for Jamstack plugins and other projects he is authoring. Additionally, Joel recently migrated code from one React-based framework to another and shares his experiences, now publishing his blog on the Next.js framework.

          If you are interested in working with Instagram posts for future development projects, or building your own plugins, this is a DevJams episode you won’t want to miss!

          Learn More about Joel's Project:

          • Blog Post
          • Project Repository

            • Mentioned Technology:

            • Gatsby
            • Next.js
            • gatsby-source-instagram
            • TypeScript
            • dotenv
            • Instagram Graph API
            • Axios
            • Netlify
            • GitHub Actions

              • Mentioned Cloudinary Products and Features:

              • Upload API
              • Public ID
              • Folders
              • Tags
              • Search API

                • Not a Cloudinary user yet? Sign up for your FREE account today!

                56 min
              • Automating Podcast Audio Delivery with Cloudinary, Next.js and Sanity - DevJams Episode #16

                Amy Dutton and James Quick host the popular Compressed.fm podcast, with amazing discussions on all things web development and design. To help deliver the episodes, they use Cloudinary’s APIs to customize their audio players and create promotional imagery in very innovative ways.

                Cloudinary’s Customer Education team sat down with Amy and James in this DevJams episode, walking through their podcast production efforts. They’ll showed their various code and scripts used to automate many of the aspects with tools like Next.js, Sanity and more.

                Mentioned Code Repositories, Samples and Scripts

                • 0046-custom-audio-player
                • compressed-nodejs
                • compressedfm
                • plop-compressed-fm

                  • Mentioned Cloudinary Technology

                  • Auto-generated waveform images
                  • Placing layers on images
                  • Semantic data extraction
                  • Video Summarization from Cloudinary Labs

                    • Mentioned Technology

                    • DatoCMS
                    • Express
                    • Figma
                    • Handlebars
                    • JavaScript
                    • Lambda Multipart Parser
                    • Markdown
                    • Next.js
                    • Oh My Zsh
                    • Plop.js
                    • React
                    • Render
                    • Sanity.io
                    • Simplecast
                    • Storybook
                    • TypeScript
                    • Vercel

                      • Follow Our Guests - Amy Dutton and James Quick

                      • James Quick's Personal Website
                      • Amy Dutton's Personal Website
                      • Compressed.fm's Official Website

                        • Follow Our Hosts - Sam Brace and Becky Peltz

                        • Sam Brace on LinkedIn
                        • Becky Peltz on LinkedIn

                          • Not a Cloudinary user yet? Sign up for your free account today!

                          1 hr 3 min
                        • Enhancing Image Delivery with Cloudinary, JavaScript Frameworks and Webhooks
                          As a developer evangelist for Adobe, Raymond Camden is always looking for new ways to enhance his image delivery methods on his personal website and projects. While investigating Cloudinary, he developed some awesome techniques for handling responsive images and delivery workflows via Pipedream-managed webhooks that could really help you!
                          Raymond joined Becky and Sam from Cloudinary’s Customer Education team, discussing his recent projects with thorough code reviews. We covered a lot in this episode, diving into static site generators like Eleventy, Alpine.js and other JavaScript frameworks, remote media delivery via Cloudinary fetch and more!
                          1 hr
                        • Optimizing Cloudinary Images in Markdown Files
                          Markdown is great for writing your next blog post, but including images in a web-friendly way is challenging. Thankfully, we can use information from Cloudinary’s APIs to modify our Markdown to display properly sized images!
                          In this DevJams episode, we sit down with Brad Garropy, Developer Experience Engineer at Atlassian. He walks us through his open source project that uses libraries like Remark and Rehype to add width and height to Cloudinary-delivered images in Markdown files, as well as demystify the topic of Abstract Syntax Trees (ASTs) for your next development project.
                          1 hr 4 min
                        • Building a Web3 Marketplace with Cloudinary and IPFS
                          Daniel Duan, who is the head of engineering at Legitimate, has helped build out a truly innovative Web3 marketplace. The Drops by Legitimate project allows artists to create non-fungible tokens (NFTs) for their physical products, such as paintings, photography and even wearable items.
                          As the artists’ product images are delivered via Cloudinary, Becky and Sam from Cloudinary’s Customer Education team sat down with Daniel for this DevJams episode. They discuss all things related to the Drops project, including a walkthrough of how Cloudinary works with IPFS for optimized, accelerated image delivery through various caching mechanisms.
                          If you are looking for a great developer-focused introduction to Web3, NFTs, cryptocurrency and the blockchain, you won’t want to miss this DevJams episode!
                          43 min
                        • Accessing Cloudinary with GraphQL in Gatsby
                          Tapas Adhikary, who is a frequent contributor on FreeCodeCamp.com and other developer resources, recently created an excellent image gallery with Gatsby and Cloudinary!
                          Becky and Sam from Cloudinary's Customer Education team sat down with Tapas to walk through his "Imaginary" project and better understand some of its components, such as its use of GraphQL and deployment via Netlify.
                          If you are looking on building your next project with any of the mentioned technologies, this is an episode you won't want to miss.
                          43 min
                        • Connecting Cellists Globally Fullstack with Python, D3.js and Cloudinary
                          In classical music, knowing the people you have trained with has a lot of value! This is why Cori Lint, software engineer at Ovia Health, developed Cello Tree - a directory of cellists to show their relationships to each other. Becky and Jen on Cloudinary's Customer Education team sit down with Cori to learn more about the project and its underlying technologies, which include Python, D3.js and Cloudinary. If you are looking to develop a side project about your passions, this is definitely a DevJams episode you won't want to miss!
                          54 min
                        • Creating GitHub Wrap with n8n, Cloudflare and Cloudinary
                          Many developers make tons of open-source contributions, but keeping track of all of the various commits, pull requests and other actions can be challenging. Harshil Agrawal, who is a Developer Advocate for Contentful and formerly with n8n, created a project that solves this issue - GitHub Wrap. Using technology like n8n, Cloudflare and Cloudinary, he developed this excellent product that makes it easy to get a yearlong recap of the parts developers have taken to benefit the open-source community. Sam and Becky from Cloudinary sit down with Harshil to walk through his project and show how he built it in episode #10 of DevJams.
                          54 min

                        About Cloudinary DevJams

                        From the publisher's feed

                        Interviews and code walkthroughs with software developers about their websites, apps and other projects that are handling management and delivery of their images and videos in innovative ways,…