egghead.io
illustration for Building an OpenGraph image generation API with Cloudinary, Netlify Functions, and React

Course

Building an OpenGraph image generation API with Cloudinary, Netlify Functions, and React

  1. 1
    Designing OpenGraph unfurls in Figma
    11m 44s
  2. 2
    Building an OpenGraph image React component in CodeSandbox, based on a Figma design
    12m 26s
  3. 3
    Setting up a new GitHub repo to deploy functions on Netlify with Make and netlify.toml
    2m 47s
  4. 4
    Scaffolding and deploying a Netlify Function in JavaScript
    1m 30s
  5. 5
    Using Playwright to screenshot the DOM and return an image from a Netlify Function
    4m 59s
  6. 6
    Compiling a React to an IIFE with Rollup to execute and render in a headless browser
    5m 43s
  7. 7
    Setting the viewport on a Playwright headless browser
    22s
  8. 8
    Testing an opengraph image with the Twitter Card Validator
    1m 38s
  9. 9
    Passing variables to serverless functions using query strings
    4m 5s
  10. 10
    Using Cloudinary as a write-through cache for a Netlify Function that generates images
    7m 32s
  11. 11
    Using _redirects files on Netlify to make .netlify function URLs more user-friendly
    58s

Setting up a new GitHub repo to deploy functions on Netlify with Make and netlify.toml

Chris Biscardi
InstructorChris Biscardi
  • netlify
    Netlify
  • git
    git
  • github
    GitHub

Share this video with your friends

Send Tweet

We scaffold out a new GitHub repo to deploy netlify functions and a small index.html file, while covering Makefile basics and netlify.toml. The lesson ends with a working Netlify site.

Build your Developer Portfolio and climb the engineering career ladder.
  • Search
  • Talks
  • Podcasts
  • Machine
  • Pricing
  • Store
©egghead.io
Terms & Conditions