OG Image Options
In this Hasty Treat, Scott and Wes talk about OG images, interesting ways you can work with them, and ways you can work dynamically with them. Show Notes Welcome What are OG images? Testing OG images Creating an OG image ...
Syntax - Tasty Web Development Treats · Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers
August 28, 202329m 48s
Audio is streamed directly from the publisher (traffic.megaphone.fm) as published in their RSS feed. Play Podcasts does not host this file. Rights-holders can request removal through the copyright & takedown page.
Show Notes
In this Hasty Treat, Scott and Wes talk about OG images, interesting ways you can work with them, and ways you can work dynamically with them.
Show Notes- 00:11 Welcome
- 02:18 What are OG images?
- 06:19 Testing OG images
- Polypane, The browser for ambitious web developers
- Meta Tags — Preview, Edit and Generate
- Sharing Debugger - Meta for Developers
- Card Validator | Twitter Developers
- 08:27 Creating an OG image
- vercel/satori: Enlightened library to convert HTML and CSS to SVG
- Open Graph (OG) Image Generation | Vercel Docs
- Introducing OG Image Generation: Fast, dynamic social card images at the Edge – Vercel
- 09:41 Dynamically generating OG images
- wesbos.com/thumbnail/?thumbnail=%2Fstatic%2F0005c028a536c87975eb84ae3d32ae57%2Faeron.jpg&title=Uses&url=https%3A%2F%2Fwesbos.com%2Fuses
- 21:16 Using Puppeteer
- Puppeteer | Puppeteer
- Puppeteer · Browser Rendering docs
- Cloudinary - Image and Video Upload, Store ad Monetization
- Fast and reliable end-to-end testing for modern web apps | Playwright
- 28:47 Canva API
- Build The Tools Behind Great Design | Canva Developers
- Scott’s Instagram
- LevelUpTutorials Instagram
- Wes’ Instagram
- Wes’ Twitter
- Wes’ Facebook
- Scott’s Twitter
- Make sure to include @SyntaxFM in your tweets
- Wes Bos on Bluesky
- Scott on Bluesky
- Syntax on Bluesky