In this video we’ll take a look at the new Image component in Next.js 10 that does automatic image optimization. We’ll cover the 4 different layout options and talk about how they differ and when to use them.

---------- Links

Image Optimization: https://nextjs.org/docs/basic-features/image-optimization
Image Component: https://nextjs.org/docs/api-reference/next/image
Starter Code: https://github.com/leighhalliday/next-image-demo/tree/524249fdb53f95ab92b3980afe6e78c27e526532
Finished Code: https://github.com/leighhalliday/next-image-demo

---------- Timeline

• 00:00 - Introduction
• 01:00 - Fixed Layout
• 04:00 - Intrinsic Layout
• 05:40 - Responsive Layout
• 08:30 - Fill Layout
• 11:30 - Loaders

#next #react #javascript #programming #developer