Migrating a Gatsby site to Astro: image optimization · Learn With Jason

Astro is a popular framework for building content-driven websites. Marcy Sutton migrated her Gatsby site to Astro, and she and Jason work together in this pair programming session to optimize image handling. *Don't forget to watch the companion episode of _The Web Dev Podcast_* for more context on why Marcy chose to leave Gatsby in favor of Astro, how to assess new tools, and the wisdom that comes with years of experience in tech: https://www.youtube.com/watch?v=MWz2_VrITEA&list=PLz8Iz-Fnk_eR7gtR7Ckuh0YTC84aaVeio&index=4 *What is Learn With Jason?* Sometimes the easiest way to see how a software tool or product works is to watch someone else build with it. In _Learn With Jason_, host Jason Lengstorf pair programs with experts from around the tech industry to learn new tools by _doing_. New episodes are published regularly. ---------------------------------------------------------------------- CodeTV supporters get early access to new videos, exclusive bonus content, and other perks. Join us in building a happier, healthier, friendlier web dev community! https://codetv.dev/support ---------------------------------------------------------------------- Chapters: 00:00 Introduction 00:30 Meet Marcy Sutton 02:01 Exploring Marcy's Website 04:35 Image Handling Challenges in Astro 05:30 Debugging Image Issues 07:27 Astro Configuration Deep Dive 10:56 Testing and Troubleshooting 12:45 Content Structure and Path Issues 30:48 Migrating to Modern Astro Config 34:55 Custom Loaders and Gatsby Comparison 35:44 Debugging Template Issues 36:14 Dynamic Pages and Content Loading 37:21 Fixing Image Paths 37:53 Content Declaration and Configuration 39:46 Slug and Path Handling 46:11 Logging and Debugging 59:11 Final Steps and Next Steps