Crop & Resize Images in React with Cloudinary - Dev Hints

Resize images and dynamically crop with AI in React using the Cloudinary URL Gen SDK.
We'll walk through resizing an image maintaining its aspect ratio, cropping an image to a square, and using AI to dynamically crop an image based on the location of the subject.
📝 Cloudinary Docs - Cloudinary URL Gen SDK
cld.media/devhintsreactcropre...
💾 Cloudinary Transformations & Effects in React
github.com/colbyfayock/cloudi...
📝 Cloudinary AI in Action
cld.media/devhintsreactcropre...
Instructor: Colby Fayock (‪@colbyfayock‬)
--
Cloudinary helps developers build performant experiences for the web with powerful optimization and transformation APIs.
🚀 Get started with a free account!
cld.media/devhintsreactcropre...
#cloudinary #devhints #reactjs #video #images #resizeimage #imageediting #webdevelopment

[@chousonic]

does it support user interface ? case scenario: if i user want to crop the image and resize it, will it still works or it must be through the code ?

[@colbyfayock]

we have a Media Editor widget that can provide this sort of functionality: cloudinary.com/documentation/media_editor you can even use the Cloudinary Upload Widget and set up the ability to crop after upload: cloudinary.com/documentation/upload_widget but neither of these are React Native and would need to be embedded into your application. here's an example of doing this with the Upload Widget: github.com/cloudinary-community/cloudinary-examples/tree/main/examples/react-upload-widget-preset