What is the alternative of Transformation from cloudinary-react in next-cloudinary?

faridqattali
faridqattali Member Posts: 1 ✭
edited August 2023 in Developer APIs

Previously we were using cloudinary-react which is working fine but recently we decided to migrate to next-cloudinary. I have got a question which couldn't find in documentation. In cloudinary-react we used Transformation component for applying transformations. How we could do the same thing in next-cloudinary?

For example:

<CloudinaryImage

          format="webp"

          publicId={logoFilename}

          width="80"

          height="80"

          style={{ borderRadius: "10px" }}

        >

          <Transformation width="160" height="160" crop="scale" />

</CloudinaryImage>

how can I refactor in next-cloudinary?

Tagged:

Answers

  • Zachary
    Zachary Member, Cloudinary Staff Posts: 46

    Hey there,

    The Next.JS cloudinary image component will look like:

    import { CldImage } from 'next-cloudinary';
<CldImage
  width="600"
  height="600"
  src="<Public ID>"


    You can read more about this integration via this short guide.

Categories