Next.js + Strapi - Image Component And Customizing Strapi Response

In this episode we are going to take quick a look at new Image component in Next.js 10 and learn how to add additional data to our Strapi response.

Next.js 10 came out recently and it brought with it new out of the box #Image component. This component will make images on your site much more performat, smaller in size and they will be lazy loaded wich can add a lot of benefits to your sites perfomance with very little actual work from you.

However #Nextjs Image component has two required props, and those are width and height. Unfortunately #Strapi doesn't give us width and height of the images in our API out of the box. So we would have to customize our response to include those values. And in Strapi this is a peice of cake.



Code used in this video

https://bit.ly/2VeR3WD

You can support my work on Patreon

Patreon: watchlearn

Follow me on Social Media

Github:  https://github.com/ivandoric
Twitter:  Twitter: ivan_doric
Instagram:  Instagram: watchlearntuts
Facebook:  Facebook: watchlearntutorials

• #education
• #strapi
• #javascript
• #next
• #nextjs
• #api
• #image
• #images